在哪里以及如何注入 $stateParams？

Question

我正在尝试在具有 Angular ui-router 和 $stateParams 的单页应用程序中将图像和文本添加到视图 "home" 中。

'use strict';
angular.module('confusionApp')
.controller('IndexController', ['$scope', '$stateParams', 'menuFactory', 'corporateFactory', function($scope, $stateParams, menuFactory, corporateFactory) {

        var dish = menuFactory.getDish(parseInt($stateParams.id,10));
        $scope.dish = dish;

        var promo = menuFactory.getPromotion(parseInt($stateParams.id,10));
        $scope.promo = promo;

        $scope.leader = corporateFactory.getLeader($stateParams.abbr)

    }])

    .controller('AboutController', ['$scope', 'corporateFactory', function($scope, corporateFactory) {
        $scope.leaders = corporateFactory.getLeaders();

   }])

menuFactory 服务在带有列表和参数的 'MenuController' 中工作正常（在 'submit' 时注入）。 corporateFactory 在使用 'AboutController' 的列表中工作正常。但我就是找不到如何在 index.html 打开时注入 $stateParam 视图 'home.html.

   <div class="container" ng-controller="IndexController">
    <div class="row row-content">
        <div class="col-xs-12 col-sm-3 col-sm-push-9">
            <p style="padding:20px;"></p>
            <h3 align=center>Our Lipsmacking Culinary Creations</h3>
        </div>
        <div class="col-xs-12 col-sm-9 col-sm-pull-3">
            <h4>Implement the Featured Dish Here</h4>
            <div class="media">
                <div class="media-left media-middle">
                    <a>
                        <img class="media-object img-thumbnail"
                        ng-src={{dish.image}} alt={{dish.name}}>
                    </a>
                </div>
            </div>
            <div class="media-body">
                <h2 class="media-heading">{{dish.name}}
                    <span class="label label-danger">{{dish.label}}</span>
                    <span class="badge">{{dish.price | currency}}</span></h2>
                <p>{{dish.description}}</p>
            </div>
        </div>
    </div>

有人能帮帮我吗？

Answer 1

不要使用 $stateParams

改为注入 $state 然后访问

 $state.params.wotever

Answer 2

感谢 JB Nizet 和 danday74 的宝贵帮助！问题是让模板知道要显示哪道菜的属性。我找到的答案在 controllers.js 中。首先，我必须更正一个错误，然后我创建了一个只包含所需菜品的 $scope.property：

var up = menuFactory.detDish(0);
$scope.up = up;

然后我可以在模板中使用{{up.image}}、{{up.name}}等。

在哪里以及如何注入 $stateParams？

Where and how to inject $stateParams?

state

angularjs

single-page-application

angular-ui-router