Как я могу обновить свой вид/область в Angular

Question

В области «свойство ug» зависит от «пользователя» и «возраста», когда я обновляю «пользователь» или «возраст», почему «ug» не обновляется ? Как я могу обновить "UG"

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
<div ng-app="myApp" ng-controller="ctrl"> 
    user:<input ng-model="user"> 
    <br> 
    age:<input ng-model="age"> 
    <br> 
    user and age : <span style="color: red" ng-bind="user + '-and-' + age"></span> 
    <br> 
    ug:<span style="color:red;" ng-bind="ug"></span> 
    <br> 
    addAge:<span style="color:red;" ng-bind="addAge"></span> 
</div> 

ANGULAR JS КОД

angular.module('myApp', []) 
    .controller('ctrl', ['$scope', function($scope) { 
     var fn = function(user, age) { 
      //TODO 
      return user + '-fn-' + age; 
     } 
     $scope.user = 'taven'; 
     $scope.age = '30'; 
     $scope.ug = fn($scope.user, $scope.age); 
    }]); 

Answer 1

Insted из ng-bind="ug" записи ng-bind="fn(user, age)". Конечно, добавить: $scope.fn = fn; внутри кода контроллера:

HTML:

ug:<span style="color:red;" ng-bind="fn(user, age)"></span> 

Javascript:

.controller('ctrl', ['$scope', function($scope){ 
    $scope.user = 'taven'; 
    $scope.age = '30'; 
    $scope.fn = function(user, age){ 
     //TODO 
     return user + '-fn-' + age; 
    } 
}]); 

Answer 2

Вы можете вызвать нг щелкните событие, чтобы обновить область как это.

angular.module('myApp', []) 
 
      .controller('ctrl', ['$scope', function($scope){ 
 
       var fn = function(user, age){ 
 
        //TODO 
 
        return user + '-fn-' + age; 
 
       } 
 
       $scope.user = 'taven'; 
 
       $scope.age = '30'; 
 
       $scope.updateScope = function(){ 
 
        $scope.ug = fn($scope.user, $scope.age); 
 
       } 
 
       
 
      }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="ctrl"> 
 
    user:<input ng-model="user"> 
 
    <br> 
 
    age:<input ng-model="age"> 
 
    <br> 
 
    user and age : <span style="color: red" ng-bind="user + '-and-' + age"></span> 
 
    <br> 
 
    ug:<span style="color:red;" ng-bind="ug"></span> 
 
    <br> 
 
    addAge:<span style="color:red;" ng-bind="addAge"></span> 
 
    
 
    <button ng-click=updateScope()>Update scope</button 
 
</div>