Question

我刚开始使用angular.js，而今天我正在编写控制器：

myApp.controller('RepetitionController', ['$scope', '$location', 'repetitionService',
    function ($scope, $location, repetitionService) {



        $scope.questions = repetitionService.getQuestions();
        $scope.questionsLeft = $scope.questions.length;
        $scope.questionsAnswered = 0;
        $scope.percentageLeft = ($scope.questionsLeft == 0 ? 100 : 0);
        $scope.repetitonState = ??? 
        $scope.endRepetition = function () {
            repetitionService.clearSelectedSets();
            $location.path("/setsAndCollections");
        }

        $scope.submitAnswer = function () {
            alert("alert");
        }
    }]);

我开始怀疑。

你可以看到我使用三元运算符来创建$scope的初始状态，现在在我的repetitionState字段中，我想要这样的(questionsLeft === 0 ? 'finished' : questions[0].type)。

有没有什么方法可以定义一个在填充$scope对象（某种后构造函数）之后调用的函数？

或许有一种方法可以“观察”功能，所以我可以写

$scope.repetitionState = function(){
    ///logic here
};

我只是担心会出现需要编写logicalExpression ? anonymousFunction () : someOtherAnonymousFunction()的情况，对我来说，嵌套所有这些匿名函数（现在）有点难读，我想知道是否有是angular的某些部分，可能在这种情况下有用。

Answer 1

你当然可以观看一个功能。 $watch为watchExpression参数接受字符串或函数。如果您正在使用函数，则将当前作用域作为第一个参数传递给该函数。

要记住的一件重要事情是watchExpression函数应该是幂等的，因此请确保只更新侦听器函数中的范围。

$scope.repititionState = getRepititionState($scope);

$scope.$watch(getRepititionState, function(newVal, oldVal, scope) {
    scope.renditionState = newVal;
});

function getRepititionState(scope) {
    var repititionState;
    // your logic here, just remember to set and return repititionState
    return repititionState;
}

Answer 2

您想在哪里引用repititionState为什么不将它作为函数引用？

例如：我们假设您将使用repititionState为您提供如下课程

<div ng-class="repititionState"></div>

$scope.repititionState = ($scope.questionsLeft === 0 ? 'finished' : $scope.questions[0].type)

这样，只要你的问题完成，div就会得到一个finished的类。为了使这个repititionState依赖于另一个变量（就像你想要的那样），就像把它变成一个函数一样简单。

<div ng-class="repititionState()"></div>

注意额外的()，它现在将repititionState标记为函数。

$scope.repititionState = function(){
    return ($scope.questionsLeft === 0 ? 'finished' : $scope.questions[0].type);
}

如果你在ng-repeat之内，那么你甚至可以通过$index来使这个功能更通用。

$scope.repititionState = function($index){
return ($scope.questionsLeft === 0 ? 'finished' : $scope.questions[$index].type);
}

这通常称为其他框架中的计算属性。在Angular中它只是一个功能。希望这会有所帮助。

Angularjs控制器 - 非平凡的初始状态

2 个答案: