錯誤：$ injector：unpr未知的提供程序 - > $ routeProviderProvider

-3

Unknown provider: $routeProviderProvider <- $routeProvider

我在運行代碼時遇到了此錯誤。我已經嘗試了所有的固定機制。任何想法都無法正常工作。我在這裏分享我的代碼。

我需要的功能是，如果我點擊它應該重定向到正確的頁面的子菜單項。它應該從action.json文件獲取路徑

basePrductContoller.js

App.controller("BaseProductController", ['$scope', '$sce', '$routeProvider', function ($scope, $sce, $routeProvider) { 
    //some code here 
    console.log('process_base_product()' + $routeProvider.json_url); 

    $.getJSON("./api-data/" + $routeProvider.json_url, function (json) { 
     $scope.data = json; 
     console.log('JSON--', $scope.data); 
     $scope.processdata(); 
    }); 

    result += '<form id="myform" action="http://building/dev-1/api/' + $routeProvider.post_method_url + '" method="post" >'; 

    //code continues 
}]);

側menu.html

<ul id="submenu-2" class="collapse"> 
    <span ng-repeat="item in itemDetails"> 
     <li> 
      <a href="#base-product?{{item.path}}&{{item.apiPath}}" > {{item.title}}</a> 
     </li> 
    </span> 
</ul>

App.js

var App = angular.module('EnergyFocusApp', ['ngRoute']); 
App.config(function ($routeProvider) { 

    $routeProvider 


     .when('/base-product:json_url?:post_method_url?', { 
      templateUrl: 'templates/base_product.html', 
      controller: 'BaseProductController' 
     }) 

});

側導航控制器

App.factory('itemsFactory', ['$http', function ($http) { 
    var itemsFactory = { 
     itemDetails: function() { 
      return $http({ 
        url: "api-data/action.json", 
        method: "GET", 
       }) 
       .then(function (response) { 
        return response.data; 
       }); 
     } 
    }; 
    return itemsFactory; 

}]); 


App.controller('SidenavController', ['$scope', 'itemsFactory', function ($scope, itemsFactory) { 

    console.log("side nav controller is being tested in the local host") 
    var promise = itemsFactory.itemDetails(); 

    promise.then(function (data) { 
     $scope.itemDetails = data; 
     console.log(data); 
    }); 
    $scope.select = function (item) { 
     $scope.selected = item; 
    } 
    $scope.selected = {}; 
}]);

action.json

[ 
    { 
     "title": "Product View", 
     "path": "actions/product/view.json", 
     "urlpath": "product_view?segment=product-view", 
     "apiPath": "api/merchant_product_view", 
     "methodType": "post" 
    }, 
    { 
     "title": "Product Add", 
     "path": "actions/product/add.json", 
     "urlpath": "product_add?segment=product_add", 
     "apiPath": "api/merchant_product_add" 
    }, 
    { 
     "title": "Product Update", 
     "path": "actions/product/update.json", 
     "urlpath": "product_update?segment=product_update", 
     "apiPath": "api/merchant_product_update" 
    }, 
    { 
     "title": "Product delete", 
     "path": "actions/product/delete.json", 
     "urlpath": "product_delete?segment=product_delete", 
     "apiPath": "api/merchant_product_delete" 
    } 
]

基product.html

<div id="result" style="width:600px; text-transform: capitalize;" align="right"></div>

來源

2017-05-19 Deepak Vijay

你在縮小文件嗎？你是否包含['ngRoute']（https://docs.angularjs.org/api/ngRoute）腳本？ – George

@George：是的我已經包括ngRoute在app.js TE app.module並提到的所有示例代碼，但不能確定這 –

我的意思是你做了''在你的HTML？ – George

無法訪問\注入providers內的controller. 所以下面這行是導致你的問題。

App.controller("BaseProductController", ['$scope', '$sce', '$routeProvider', function ($scope, $sce, $routeProvider) {..\\

您需要在控制器中注入$route, $routeParams, $location以播放路由。

來源

2017-05-19 08:29:17 anoop

你能告訴我這個例子嗎？ –

@DeepakVijay：我不知道你是否檢查了我的答案中包含的鏈接，鏈接中有鏈接。你可以拿這個例子。 [見此]（https://plnkr.co/edit/fVWdahTQSeiGhAwY6S6P?p=preview） – anoop

和上面提到的Anoop一樣，routeprovider應該在別處。即在UR配置（）

app.config(function($routeProvider) { 
    $routeProvider 
    .when("/", { 
     templateUrl : "main.htm" 
    }) 
    .when("/red", { 
     templateUrl : "red.htm" 
    }) 
    .when("/green", { 
     templateUrl : "green.htm" 
    }) 
    .when("/blue", { 
     templateUrl : "blue.htm" 
    }); 
});

BTW：這將是明智的使用UI路由器比ngRoute模塊在UI路由器，U可以做更多的事情，如添加子視圖狀態等

UI路由器是生產環境中的標準實現。

因此，請在您的第一個基礎* .js文件中清除此部分。如果你想要一個json_url，嘗試使用一個值（）[如果你的json-url被修復]，否則使用$ location來代替。

來源

2017-05-19 08:35:26 Plankton

錯誤：$ injector：unpr未知的提供程序 - > $ routeProviderProvider

回答

相關問題