何處以及如何注入$ stateParams？

我正在嘗試在單頁應用程序中使用Angular ui-router和$stateParams將圖像和文本導入視圖「主頁」。

'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'中正常工作。 corporateFactory使用'AboutController'在列表中正常工作。但是我只是無法知道如何在index.html以視圖'home.html打開時注入$ stateParam。

<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>

請問有人幫我嗎？

來源

2016-03-05 swissfritz

index.html不應包含主頁視圖。它應該包含指令，如果URL是家庭的URL，則路由器將在其中注入主頁視圖。 –

抱歉，錯誤地描述它。 index.html包含3個用於標題，內容和頁腳的ui-view指令。我想表達的是，當index.html加載時，home.html被加載到index.html的內容區域，但沒有指定'$ stateParam''dish._id'。因此「{{dish.image}}」等不顯示。 – swissfritz

然後從主視圖中刪除'ng-controller =「IndexController」''。但我不明白你在問什麼。你面臨的問題是什麼？你**正在**注入$ stateParams。 –

不使用$ stateParams

注入$狀態，而不是再訪問

$state.params.wotever

來源

2016-03-05 11:55:28 danday74

感謝您的寶貴幫助JB Nizet和danday74！問題是讓模板知道要顯示哪個菜的屬性。我找到的答案在controllers.js中。首先，我必須糾正錯誤，然後我創建一個只包含所需的菜一$ scope.property：

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

然後，我可以使用{{} up.image}，{{up.name}}等等。

來源

2016-03-06 06:03:10 swissfritz

何處以及如何注入$ stateParams？

回答

相關問題