Изменить контрольные переменные в угловом

Question

angular.module('myApp', []).controller('namesCtrl', function($scope) { 
$scope.names = [ 
    {name:'Jani',country:'Norway'}, 
    {name:'Hege',country:'Sweden'}, 
    {name:'Kai',country:'Denmark'} 
]; 
}); 

function abc(){ 
$.ajax({url: "demo_test.txt", success: function(result){ 
    $scope.names = result; // here 
}}); 
} 

Я хочу изменить содержимое scope.names по результату (оно будет в формате json), а затем отобразить содержимое на угловом.

И я хочу уточнить, что я обязан использовать получить запрос от внутри функции, поэтому не могу использовать $ HTTP угловой

Answer 1

Я понимаю, что у вас нет доступа к сфере действия. Вам нужно получить доступ к области действия с помощью angular.element('[ng-controller=namesCtrl]').scope(), тогда у вас будет реальный контроль над областью, но переменная в области не будет работать с циклом дайджеста, вам нужно запустить ее вручную, используя $apply() в этой области.

Код

function abc(){ 
$.ajax({url: "demo_test.txt", success: function(result){ 
    var scope = angular.element('[ng-controller=namesCtrl]').scope() 
    scope.names = result; // here 
    if(!scope.$$phase) 
     scope.$apply(); //this will make available names in namesCtrl scope. 
}}); 
} 

Answer 2

Использование $http вместо AJAX, потому что $http заботится работает переваривать цикл, который заботится о 2-сторонняя привязка.

function abc(){ 
    $http.get("demo_test.txt") 
    .then(function(result){ 
    $scope.names = result; 
    }); 
} 

Если по какому-либо причинам вы не можете использовать $http, то вы должны вызвать метод $scope.$apply установить контекстное значение, потому что он внутренне запускает цикл дайджеста.

function abc(){ 
$.ajax({ 
    url: "demo_test.txt", 
    success: function(result){ 
     $scope.$apply(function() { 
     $scope.names = result; 
     }); 
    } 
}); 
} 

Если у вас есть abc метод вне контроллера, то вы должны будете получить объем контроллера, как показано ниже, которые, однако, не рекомендуется по угловой.

function abc(){ 
var $scope = angular.element('[ng-controller=namesCtrl]').scope(); 
$.ajax({ 
    url: "demo_test.txt", 
    success: function(result){ 
     $scope.$apply(function() { 
     $scope.names = result; 
     }); 
    } 
}); 
} 

Answer 3

Вам нужно что-то, чтобы Angular знал, что ему нужно следить за этим изменением. Угловой способ сделать это - $http, но вы также можете использовать $scope.$watch.