AngularJS和ui-bootstrap注入錯誤（？）

請原諒我，如果這個錯誤有點簡單，但我似乎得到這些注入錯誤，並在Firefox調試器似乎並沒有幫助我。這裏的代碼片段AngularJS和ui-bootstrap注入錯誤（？）

這是在app.js文件問題

App.controller('ModalInstanceCtrl', function ($scope,$uibModal, menuAppetizers) { 
$scope.menuAppetizers; }); 

App.controller('AppetizerMenuController', 
    ['$rootScope', '$scope', '$http', 'ParseService', '$location', '$q', '$uibModal', 
    function ($rootScope, $scope, $http, $location, ParseService, $q, $uibModal) { 
     //.... needless code not related to the problem 

     $scope.open = function (_menuAppetizer) { 
     console.log("We get into the modal open"); 
     var modalInstance = $uibModal.open({ 
      controller: 'ModalInstanceCtrl', 
      templateUrl: "Views/menu/myModal.html", 
      resolve: function() { 
       return _menuAppetizer; 
      } 
     }); 
    } 
}]);

控制器文件，其中我呼籲用戶界面的自舉：

var App = angular.module('App', 
['ngRoute', "ui.bootstrap"])

這似乎看起來罰款我。這包括我的項目的大部分路由。

爲AppetizersController視圖只顯示模式片段：

<button type="button" class="btn btn-default btn-sm" ng-click="open(menuAppetizers)" 
    data-toggle="modal" data-target="#myModal.html">Nutrition Info</button>

哪些應該去modal.html並打開它是列在這裏

<div class="modal fade" id="myModal.html" role="dialog"> 
    <div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">Nutrition Info</h4> 
     </div> 
     <div class="modal-body"> 
      <p>Calories: {{menuAppetizers.NutritionInfo}}</p> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
</div>

的內容對不起，如果我沒有發佈足夠的代碼，我可以讓模式工作，但是當我嘗試使用$ modal.open時，它返回一個注入器錯誤。我注射了錯誤嗎？我查找了這個問題，我似乎遵循了ui-bootstrap文檔中的規則。我錯過了什麼嗎？我對angularjs/ui-bootstrap很陌生。

錯誤，我得到：

Error: [$injector:unpr] http://errors.angularjs.org/1.4.7/$injector/unpr?p0=menuAppetizersProvider%20%3C-%20menuAppetizers%20%3C-%20ModalInstanceCtrl 

e/<() angular.min.js:107 
Ze/this.$get</<() angular.min.js:80 
f/<() angular.min.js:119 
lf/this.$get</n.prototype.$eval() angular.min.js:133 
lf/this.$get</n.prototype.$digest() angular.min.js:130 
lf/this.$get</n.prototype.$apply() angular.min.js:133 
h() angular.min.js:87 
K() angular.min.js:91 
Sf/</z.onload()

來源

2015-11-02 Leruce

你能告訴我哪裏添加了ui-bootstrap js。我認爲有序列中斷 – Shohel

它被添加到所有其他腳本應該在的索引文件中。從firefox中的調試器中，錯誤似乎位於ModalInstanceCtrl中。如果我正確地閱讀它。只是不知道如何解決它。 – Leruce

你可以在你的問題的底部附加錯誤堆棧跟蹤嗎？「ModalInstanceCtrl」似乎不需要任何'$ uibModal'注入，因爲裏面沒有邏輯，沒有範圍隔離。 AppetizerMenuController是父範圍嗎？ – morels

有一個在注射錯誤：

App.controller('ModalInstanceCtrl', ['$scope', '$uibModal', 'menuAppetizers',function ($scope,$uibModal, menuAppetizers) { 
$scope.menuAppetizers; }]); 

App.controller('AppetizerMenuController', 
    ['$rootScope', '$scope', '$http', '$location', 'ParseService', '$q', '$uibModal', 
    function ($rootScope, $scope, $http, $location, ParseService, $q, $uibModal) { 
.... needless code not related to the problem

'ParseService', '$location', '哪裏倒。

來源

2015-11-02 08:16:57 morels

$ location，ParseService放置錯誤，但$ uibModal現在仍在使用 – Shohel

你的決心應該是：

resolve: { 
    menuAppetizers: function() { 
     return _menuAppetizer; 
    } 
}

在你的控制器，你宣佈一個menuAppetizers依賴，但是在你的決心，你沒有聲明menuAppetizers對象，而不是你聲明的函數，這就是爲什麼它不工作。

來源

2015-11-02 10:28:40 ThisIsMarkSantiago

爲什麼這會起作用？那麼它現在通過console.log來達到那個部分。我想我自己打破了模態內容的一部分。所以我應該能夠在思考它之後解決這個問題。多謝。 – Leruce

在你的控制器中，你聲明瞭一個menuAppetizers依賴項，但是在你的決定中，你沒有聲明menuAppetizers對象，而是聲明瞭一個函數，這就是爲什麼它不起作用。 – ThisIsMarkSantiago

AngularJS和ui-bootstrap注入錯誤（？）

回答

相關問題