javascript - 无法从 Jquery 到 Angular 的 $scope 获取值？

Question

大家好，我是 AngularJS 的学习者。我对此有疑问。我想问你为什么它不向我显示 HTML 页面的数据。当我按 F12 时，它没有显示任何错误...为什么我无法为变量 $scope=students 设置数据？ 有人可以向我解释为什么吗？非常感谢:)

 <div id="angularController" data-ng-controller="firstCtrl" data-ng-app="app">
            <table>
                <tbody>
                    <tr>
                        <th>
                            ID
                        </th>
                        <th>
                            Name
                        </th>
                        <th>
                            University
                        </th>
                        <th>
                            Gender
                        </th>
                    </tr>

                    <tr data-ng-repeat="student in students">
                        <td>
                            {{student.id}}
                        </td>
                        <td>
                            {{student.name}}
                        </td>
                        <td>
                            {{student.university}}
                        </td>
                        <td>
                            {{student.gender}}
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
 <script type="text/javascript">    
            var str;
            $(document).ready(function () {
                str = '{"id":"1","name":"Nang Thang Hai","university":"Hutech University","gender":"true"},{"id":"2","name":"Gio Thang Chin","university":"Foreign Trade University","gender":"false"}';
                angular.element('#angularController').controller().doSomthing(str);
                //angular.element('#angularController').controller()
            });
            var app = angular.module('app', []);
            app.controller('firstCtrl', function ($scope) {           
                //$scope.students = json = $.parseJSON('[' + str + ']');
                $scope.doSomthing = function (str) {
                    json = $.parseJSON('[' + str + ']');                    
                     alert(json[0].name);// it shows data here:Bui Vuong Khanh
                $scope.students = json;//is it right ?
                };
                return {
                    doSomthing: $scope.doSomthing
                };

            });
</script>

Answer 1

如果可能的话，我永远不会推荐它，但这里的问题是，当您从摘要周期之外更新范围值时，AngularJS将不会运行与范围属性关联的监视，因此UI和其他更新已完成 Angular watch 不会发生这种情况。

一种可能的解决方案是调用 Scope.$apply()这将有助于执行 Angular 生命周期方法。

var str;
$(document).ready(function () {
    str = '{"id":"1","name":"Nang Thang Hai","university":"Hutech University","gender":"true"},{"id":"2","name":"Gio Thang Chin","university":"Foreign Trade University","gender":"false"}';
    angular.element('#angularController').controller().doSomthing(str);
    angular.element('#angularController').scope().$apply();
    //angular.element('#angularController').controller()
});

演示:Fiddle