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

Question

现在我在问题中添加了代码。 控制器.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 在 Object.d [as get] (angular.js:4654) 在 angular.js:4506 在 d (angular.js:4654) 在 e (angular.js:4678) 在 Object.invoke (angular.js:4700) 在 Object.$get (angular.js:4547) 在 Object.invoke (angular.js:4708) 在 angular.js:4507

'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;
      }
    }
  ]);

//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;
  });

Answer 1

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

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

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

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;
      }
    }
  ]);

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