Question

现在我在问题中添加了代码。 controllers.js services.js

并收到此错误。 angular.js：13642错误：[$ injector：unpr] http://errors.angularjs.org/1.5.6/ $ injector / unpr？p0 =％24scopeProvider％20％3C-％20％24scope％20％3C-％20CF 在angular.js：38 在angular.js：4501 at Object.d [as get]（angular.js：4654）在angular.js：4506 在d（angular.js：4654）在e（angular.js：4678） at Object.invoke（angular.js：4700） at Object。$ get（angular.js：4547） at Object.invoke（angular.js：4708）在angular.js：4507

＆＃13;

'use strict';
angular.module("carsApp")
  .controller("carsController", ["$scope", "CF",
    function($scope, CF) {
      $scope.tab = 1;
      $scope.filterTxt = '';
      $scope.showDetails = false;
      $scope.cars = CF.getCars();
      $scope.selectMenu = function(setTab) {
        $scope.tab = setTab;
        if (setTab === 2) {
          $scope.filterTxt = "BMW";
        } else if (setTab === 3) {
          $scope.filterTxt = "HONDA";
        } else if (setTab === 4) {
          $scope.filterTxt = "TOYOTA";
        } else {
          $scope.filterTxt = "";
        }
      }
      $scope.isSelected = function(val) {
        return ($scope.tab === val);
      }
      $scope.toggleDetails = function() {
        $scope.showDetails = !$scope.showDetails;
      }
    }
  ]);

＆＃13;

//Sser 
angular.module("carsApp")
  .factory("CF", function($scope) {
    var carFact = {};
    $scope.cars = [{
      id: '1',
      make: 'BMW',
      name: 'BMW',
      image: 'images/bmw/bmw1.png',
      model: '2005',
      price: '4500',
      description: 'A very nice maintained car. Good road grip, no work required. Next inspection March 2017',
      comment: ''
    }, {
      id: '2',
      make: 'HONDA',
      name: 'Civic',
      image: 'images/honda/honda1.png',
      model: '2016',
      price: '25000',
      description: 'Honda is a nice car. Good road grip, no work required. Next inspection March 2017',
      comment: ''
    }, ];
    carFact.getCars = function() {
      return cars;
    };

    carFact.getCar = function(index) {
      return cars[index];
    };
    return carFact;
  });

＆＃13;

Answer 1

Factory Provider没有范围变量的概念，与控制器的意义相同。如有必要，可以将另一个值注入该工厂 - 例如：

angular.module('carsApp', [])
.value('topCarId','1')
.factory('CF', ['topCarId',function(topCarId) {
      //this factory provider can utilize topCarId 
});

这是一个简化示例，提示用户选择汽车。它利用ngOptions将汽车添加到选择列表中，尽管您的代码可能会在按钮或其他元素上调用 selectMenu（）。

＆＃13;

angular.module('carsApp', [])
  .factory('CF', function() {
    var cars = [{
      id: '1',
      make: 'BMW',
      name: 'BMW',
      description: 'A very nice maintained car...'
    }, {
      id: '2',
      make: 'Honda',
      name: 'Civic',
      description: 'Honda is a nice car...'
    },
{
      id: '3',
      make: 'Toyota',
      name: 'Camry',
      description: 'Toyota is a nice car...'
    }];
    return {
      getCars: function() {
        return cars;
      }
    };
  })
  .controller('carsController', ['$scope', 'CF',
    function($scope, CF) {
      $scope.cars = CF.getCars();
      $scope.filterTxt = '';
      $scope.tab = 0;
      $scope.car = {};
      $scope.selectMenu = function(setTab) {
        $scope.tab = setTab;
        $scope.filterTxt = $scope.car.make;
      }
    }
  ]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="carsApp" ng-controller="carsController">
  Choose a car: <select ng-model="car" ng-options="car as car.name for car in cars track by car.id" ng-change="selectMenu(car.id)"></select>
  
  <div>FilterTxt: <span ng-bind="filterTxt"></span></div>
  <div>Tab: <span ng-bind="tab"></span></div>
</div>

＆＃13;

AngularJS错误：$ injector：unpr未知提供程序。编辑

1 个答案: