javascript - Angular - 如何通过 $scope 中的函数更改 $scope 属性值

Question

如何通过 $scope 中的函数更改 $scope 属性值？

html，

<div ng-app="myApp" ng-controller="SimpleController">{{greeting}}</div>

Angular ，

var app = angular.module("myApp", []);

app.controller('SimpleController', function($scope) {
    $scope.name = "World";
    $scope.greeting = "Hi";
    $scope.sayHello = function() {
        return $scope.greeting = "Hello " + $scope.name;
    };
});

结果，

Hi

我所期望的，

Hello World

或者，我可以通过函数向 $scope 添加属性吗？

app.controller('SimpleController', function($scope) {
    $scope.name = "World";
    $scope.sayHello = function() {
        return $scope.greeting = "Hello " + $scope.name;
    };
});

html，

<div ng-app="myApp" ng-controller="SimpleController">{{greeting}}</div> 

我什么也没得到...

有什么想法吗？

Answer 1

好的，$scope.greeting 是在 $scope.sayHello 函数内部定义的，因此在 之前不存在名为 greeting 的作用域属性>sayHello() 函数执行。

执行函数，问候语将在HTML中可用

app.controller('SimpleController', function($scope) {
    $scope.name = "World";
    $scope.sayHello = function() {
        return $scope.greeting = "Hello " + $scope.name;
    };

    //execute the function after execution greeting will be available in the html
    $scope.sayHello();
});

Example

返回或不返回任何东西都没关系

在该函数内

 return $scope.greeting = "Hello " + $scope.name;

首先 $scope.greeting 分配值，然后在 html 中会有 $scope.greeting。