从简单的 JavaScript 代码访问 AngularJS $scope 变量答案

【问题标题】：Access AngularJS $scope variable from simple JavaScript code从简单的 JavaScript 代码访问 AngularJS $scope 变量
【发布时间】：2018-01-29 10:39:06
【问题描述】：

这似乎不是重复的

AngularJS access scope from outside js function，因为我不希望在任何点击时访问此变量！

我的 Maincontroller.js 中有 AngularJS 代码

<div ng-controller = "Maincontroller">
   $scope.name = "Hello";
</div>

在我的 main.HTML 文件中，我有 JavaScript 代码，我想要这个 $scope.name 值：

 <html>
       <script>
          // But this seems not possible with {{ name}}
       </script>
 </html>

有没有可能在 JavaScript 代码中访问这个 $scope 变量？

【问题讨论】：

等一下，您想用... javascript 编写javascript 代码吗？为什么不直接将其写入<script> 标签而不是让它们表达出来？
如何在脚本中直接使用 Name ？这样做会出错！！
忘记了在 JS 中设置控制器的任何事情，你知道你在 div 中编写 JavaScript 代码吗？您需要交换 <div> 和 <script> 中的代码
html 中的 Javascript 代码是用编写的，而 $scope.name 在我的控制器文件中！！检查更新
您的 .js 文件中有 html 代码..？查看 AngularJs 文档的第一页，了解如何创建控制器。

标签： javascript html angularjs

【解决方案1】：

请您检查以下代码。我所做的是我在 UI 上发布了名称，并在 id 的帮助下，在 getElementById 和 innerHTML 的帮助下从 javascript 代码中获取了值。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
</head>
<body >
    <div ng-app="app" ng-controller="Maincontroller">
        Angualr Scope: <h1 id="name">{{name}}</h1>
    </div>

    <div>
        A button to call a function from simple javascript function: <button onclick="getData()">Get Data: </button>        
    </div>

    <script src="../lib/angular.js"></script>

    <script>
        var getData = function(){
            var name = document.getElementById('name');
            console.log(name.innerHTML);
        }
    </script>

    <script>
        var app = angular.module('app', []);
        app.controller('Maincontroller', function ($scope) {
            $scope.name = "Hello";
        });
    </script>
</body>
</html>

【讨论】：