$rootScope не меняет содержимое.... В чем моя ошибка?

У меня проблема с $rootScope. Я изменяю значение в событии нажатия кнопки, но оно НЕ изменяется в директиве.

HTML-страница показывает "ТЕСТ" для начала, при нажатии кнопки я ожидаю изменить на "НАЖМИТ". В чем ошибка? в моем коде, пожалуйста, помогите.

<html>
<script src="jquery.min.js"></script>
<script src="angular.js"></script>
<script>
       "use strict";
       var app = angular.module('myApp', []);

       app.run(function ($rootScope) {
                $rootScope.name = 'TEST';
       });

       app.controller('btnCtrl', function($scope, $rootScope){

       $("#Btn").click( function($rootScope) {
            alert('Btn clicked');
            $rootScope.name = 'CLICKED';
       });

     });

</script>
<body>
    <div ng-app="myApp">

        <b> {{name}} </b>  
        <p> Clcik button to change above text to "CLICKED", <u>not working why?</u></p> 

        <div ng-controller="btnCtrl" > 
            <input type="button" value="Button" id="Btn" />   
        </div>    
    </div>
</body>
</html>
Источник

1 ответ

Использование ng-click вместо того, чтобы связать click событие jquery-way. Так должно быть <input type="button" value="Button" id="Btn" ng-click="assignNewName()" />, И внутри вашего контроллера:

app.controller('myCtrl', function($scope, $rootScope) {
  $scope.assignNewName = function() {
    $rootScope.name = 'Foo';
  }
});
Источник
Другие вопросы по тегам