javascript - 如何在另一个 JavaScript 脚本中检索从 AngularJS 返回的数据

标签 javascript angularjs

我正在使用 Angular 从 Controller 获取输出并使用 ng-bind 显示。但我有一个完全独立的 javascript,它需要使用从 Angular 返回的值。

在下面的代码中,TestAppCtrl 被调用并且输出在 DOM 中正确显示,但是当我尝试在第二个脚本的警告框中显示时,它显示为未定义。即使在我的第二个脚本中,我也尝试了多种方法,通过元素获取和获取内部 html 等,但它始终未定义。

<html ng-app="testApp">
<head><script src="lib/angular.min.js"></script> </head>
<body>

    <div ng-controller="TestAppCtrl">
       <div id="data"><span ng-bind="data" ></span></div>
     </div>

  <script>

     var testApp = angular.module('testApp', []);

       testApp.controller('TestAppCtrl', function ($scope) {
       $scope.data = [1, 2, 4, 5];
       });

    </script>



    <script>
    window.alert(data);
    </script>


</body>
</html>

最佳答案

请参阅下面的工作演示。

var app = angular.module('app', []);

app.controller('TestAppCtrl', function($scope) {
  $scope.data = [1, 2, 4, 5];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="app">
  <div ng-controller="TestAppCtrl" id="TestAppCtrl">
    {{data | json}}
  </div>

  <script>
    angular.element(document).ready(function() {

      var controllerElement = document.querySelector('#TestAppCtrl');
      var controllerScope = angular.element(controllerElement).scope();
      alert(controllerScope.data);
    });
  </script>
</body>

关于javascript - 如何在另一个 JavaScript 脚本中检索从 AngularJS 返回的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27005023/

相关文章:

javascript - 2 列 bootstrap div - 左边应该固定在顶部,右边应该是可滚动的

javascript - 我可以使用不依赖于选择器的自定义 jQuery 函数进行链接吗?

javascript - 获取 ng-repeat 的匹配 ng-if 的数量

angularjs - 成功解决后带有 typescript 的 Protractor 找不到模块 'protractor'

javascript - 如何在select2中使用ajax?

angularjs - 如何防止 Angular-ui 模式关闭?

javascript - 从 AngularJS 服务检索值而不返回它们?

javascript - 更新到 Angular 1.5.3 时出现错误 'orderBy'

javascript - 调用 $mdDialog ( Angular Material ) 确认而不是默认 Javascript

javascript - Prototype Chain - 本例中使用的是原型(prototype)链吗?