$范围问题。 HTML 视图中未显示更改

Question

伙计们，我是 Angular 的新手，我遇到了一些问题：

现在我正在使用 ngJsTree 并且我正在覆盖 "selectNodeCB" 方法，当您 select 树中的一个节点时，它只是做一些事情。在我的控制器中看起来像这样：

$scope.test = "Hellow World"
...
function selectNodeCB(event, data) {
        debugger;
        $scope.test = "Goodbye World";

}

现在，当我 select UI 中的一个节点时，我们将停止在调试器上。 $scope.test 更改为 "Goodbye World" 仅此而已。方法完成后，UI（HTLM 视图）不会显示任何更改。

我相信它与 "selectNodeCB" 函数的 none $scope 查找有关，因为当我这样做时：

$scope.testFnc = function () {
        $scope.test = "Goodbye World";
};

我将其设置为单击某个按钮时效果很好。我也尝试从它执行的 "selectNodeCB" 调用 "testFnc" 但当然在 HTML.

中没有任何变化

我确定我忘记了一些非常明显的事情，所以如果有人能给我提示，我将非常高兴。

Answer 1

好人，我发现 HTML 视图中存在问题：

            <div class="portlet-body">
                <div class="container" ng-controller="EditPrizeTableCtrl as vm">
                    <div class="row" cg-busy="vm.promise">
                        <toaster-container></toaster-container>
                        <div class="col-xs-6">
                            <div class="panel-body">
                                <div id="ptTree" js-tree="treeConfig" should-apply="ac()" ng-model="treeData"
                                     tree="treeInstance" tree-events="ready:readyCB;select_node:selectNodeCB"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            ......
            <div> {{test}} </div>

现在的解决方案是：如果 {{test}} 在容器外

<div class="container" ng-controller="EditPrizeTableCtrl as vm"> ... </div>

它不起作用。如果你把 {{test}} 放在里面：

<div class="container" ng-controller="EditPrizeTableCtrl as vm"> {{test}} ... </div>

工作正常。但这不是通用的解决方案。所以你可以不创建变量 "vm" 而只在容器中你需要的地方使用 "EditPrizeTableCtrl " :

         <div class="portlet-body">
            <div class="container">
                <div class="row" cg-busy="EditPrizeTableCtrl.promise">
                    <toaster-container></toaster-container>
                    <div class="col-xs-6">
                        <div class="panel-body">
                            <div id="ptTree" js-tree="treeConfig" should-apply="ac()" ng-model="treeData"
                                 tree="treeInstance" tree-events="ready:readyCB;select_node:selectNodeCB"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        ......
        <div> {{test}} </div>

这样就完美了！

$范围问题。 HTML 视图中未显示更改

$scope issue. Changes not been displayed in HTML view

javascript

scope

jstree

angularjs