Question

我想在jQuery函数中为$ scope中的变量设置一个值，如下面的代码所示。一切都很好，但新的价值反映在用户界面。

app.controller('myCtrl', function($scope) {
    $scope.carname = "Volvo";

    $('#sample').click(function(e){
        $scope.carname = "Audi";
    });
});

以下是我的完整计划：Link

如果有人帮助我，我会很高兴。

Answer 1

为了使您的代码有效，您需要在分配$scope.$digest()后运行$scope.carname = "Audi";

像这样：

app.controller('myCtrl', function($scope) {
    $scope.carname = "Volvo";

    $('#sample').click(function(e){
        $scope.carname = "Audi";
        $scope.$digest();
    });
});

这是该计划的w3schools链接：Link

如下面的评论所述，您也可以使用$scope.$apply()，如下所示：

app.controller('myCtrl', function($scope) {
    $scope.carname = "Volvo";

    $('#sample').click(function(e){
        $scope.$apply( function() {
            $scope.carname = "Audi";
        });
    });
});

这是该计划的w3schools链接：Link

您可以在以下链接中详细了解$scope.$digest()和$scope.$apply()的使用案例：

注意：正如许多其他评论中所述＆amp;一些答案，Angular确实提供了一种内置的方法来监听click事件，称为ng-click。以下是它的文档：AngularJS: ngClick

Answer 2

Angular JS提供ng-click指令来处理click事件。只需在HTML元素中添加ng-click=function_name()作为属性。ng-click指令告诉AngularJS点击HTML元素时该怎么做

示例

＆＃13;
＆＃13;
angular.module('myApp', []) .controller('myCtrl',function($scope) { $scope.myFunc = function() { console.log('clicked'); }; });
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="myApp"> <div ng-controller="myCtrl"> <button ng-click="myFunc()">Click</button> </div>
＆＃13;
＆＃13;
＆＃13;

Answer 3

我不确定，为什么不使用标准ng-click来捕获click事件。如果您有具体原因，请解释一下。但是如果你仍然想要遵循Jquery的方式，你应该在更改值时调用角度摘要周期。使用$scope.$apply()

从jQuery设置$ scope变量的值

3 个答案: