Angularjs 工厂与控制器之间的角度通信

我是个新手。 我创建了一个工厂，以便跨多个控制器重用某些功能。 这是我的代码的一个简单版本，不起作用

JS:

HTML:

目的是能够选择一个单位，并自动转换成本

我想我的第一个问题可能是调用convert from convert_all时语法错误，无法找到原因

如果我只用convert函数测试一个成本，我就可以让转换工作，但只能在第一个实例上。i、 e.当选择另一个单元时，它不会更新。 我理解这是因为工厂是单体的，不关注所选单元的变化。 我读到我可以将工厂结果发送到rootScope或广播控制器范围，或者使用承诺，但我无法让这些解决方案中的任何一个用于我的代码，也无法找到关于最佳处理方法的明确答案

如有任何想法或建议，将不胜感激

---

thx

或者您可以用更简单的方式：

视图：

---

与其他答案中的一个类似，但是让服务返回您可能希望在控制器中使用的所有方法。还将手表添加到控制器：

var AppModule = angular.module('myApp', []);

AppModule.factory('AppService', function () {
    var self = this;
    self.srv = {
        convert: function convert(unit, value) {
            if (unit === '/day') {
                cost = value * 12 / 365;
            } else if (unit === '/month') {
                cost = value;
            } else if (unit === '/year') {
                cost = value * 365;
            }
            return cost;
        },
        convert_all: function convert_all(selected_unit, costs) {
            var converted_costs = angular.copy(costs);
            angular.forEach(costs, function (cost, key) {
                converted_costs[key].value = self.srv.convert(selected_unit, cost.value);
            });
            return converted_costs;
        }

    }
    return self.srv;
});

AppModule.controller('AppCtrl', function ($scope, AppService) {
    $scope.units = ['/day', '/month', '/year'];

    $scope.$watch('selected_unit', function (val) {
        $scope.selected_unit = val;
        $scope.converted_costs = AppService.convert_all($scope.selected_unit, $scope.costs);
    });

    $scope.costs = [{
        title: 'Rent',
        value: 800
    }, {
        title: 'Food',
        value: 400
    }];

});

---

代码的问题不在于你做得几乎完全正确，而在于你一直试图访问convert_中的convert函数，就像它声明的那样。看看这个重构哇，太棒了。很简单。应该考虑一下。。。非常感谢。没问题。。您可以单击旁边的向上箭头回答：regardsWould to，但我需要先建立一点声誉：/Nice，谢谢。我读到不推荐在工厂里使用这个。你为什么认为在这种情况下更好？你的观察者似乎比Maxime写的更简洁，你认为这样做会更好吗？你是在问转换还是你问题的前提？服务工厂很容易在项目之间进行测试和共享。它可以很好地工作，但您也可以将其放在继承的控制器中。这就是为什么我将self设置为相等。这是一个相当标准的模式。虽然这不是必须的。只能执行srv={}。。。。返回srv；等

<div ng-app="myApp">
    <div ng-controller="AppCtrl">
        <select ng-model="selected_unit" ng-options="selected_unit for selected_unit in units"></select>
        <div ng-repeat="cost in converted_costs">
            <p>{{cost.title}}: {{cost.value | currency}}</p>
        </div>
    </div>
</div>

<div ng-app="myApp">
    <div ng-controller="AppCtrl">
        <select ng-model="selected_unit" ng-options="selected_unit for selected_unit in units" ng-change=update()></select>
        <div ng-repeat="cost in converted_costs">
            <p>{{cost.title}}: {{cost.value | currency}}</p>
        </div>
    </div>
</div>

var AppModule = angular.module('myApp', []);

AppModule.factory('AppService', function(){



    function convert(unit, value){
            if (unit === '/day') {
                cost = value*12/365;
            }
            else if (unit === '/month') {
                cost = value;
            }
            else if (unit === '/year') {
                cost = value*365;
            }
            return cost;
        }
    function convert_all(selected_unit, costs){
            converted_costs = angular.copy(costs);
            angular.forEach(costs,function(cost, key){
                converted_costs[key].value = convert(selected_unit, cost.value);
            });
            return converted_costs;
        }


   var service =
    {
        convert: convert,
        convert_all: convert_all
    }

   return service;
});

AppModule.controller('AppCtrl', function($scope, AppService){
    $scope.units = ['/day', '/month', '/year'];
    $scope.selected_unit = $scope.units[1];
    $scope.costs = [{title:'Rent', value:800},{title:'Food', value:400}];
    $scope.converted_costs = AppService.convert_all($scope.selected_unit, $scope.costs); 
    $scope.update = function(){

    $scope.converted_costs = AppService.convert_all($scope.selected_unit, $scope.costs); 

    }    
});

var AppModule = angular.module('myApp', []);

AppModule.factory('AppService', function () {
    var self = this;
    self.srv = {
        convert: function convert(unit, value) {
            if (unit === '/day') {
                cost = value * 12 / 365;
            } else if (unit === '/month') {
                cost = value;
            } else if (unit === '/year') {
                cost = value * 365;
            }
            return cost;
        },
        convert_all: function convert_all(selected_unit, costs) {
            var converted_costs = angular.copy(costs);
            angular.forEach(costs, function (cost, key) {
                converted_costs[key].value = self.srv.convert(selected_unit, cost.value);
            });
            return converted_costs;
        }

    }
    return self.srv;
});

AppModule.controller('AppCtrl', function ($scope, AppService) {
    $scope.units = ['/day', '/month', '/year'];

    $scope.$watch('selected_unit', function (val) {
        $scope.selected_unit = val;
        $scope.converted_costs = AppService.convert_all($scope.selected_unit, $scope.costs);
    });

    $scope.costs = [{
        title: 'Rent',
        value: 800
    }, {
        title: 'Food',
        value: 400
    }];

});