angularjs - 从网页将变量传递给 angular.js 范围

Question

初始化时从网页传递变量的正确方法是什么$scope？

我目前知道两种可能性：

1. ng-init，这看起来很糟糕，不推荐（？）
2. 对资源使用 AJAX 请求，这需要向服务器发出我不想要的额外请求。

还有其他方法吗？

Answer 1

如果这些变量能够通过 注入ng-init，我假设您已经在 J​​avascript 中声明了它们。

因此，您应该创建一个服务 ( constant) 来共享这些变量：

var variablesFromWebPage = ...;
app.constant('initValues', variablesFromWebPage);

使用此服务，您无需在应用程序启动时将它们添加到范围内，您可以从您拥有的任何控制器中使用它，只需注入它 ( function MyCtrl(initValues) {})。

尽管如此，如果您确实要求它在范围内，那么根据文档，这是控制器的主要用途之一：

使用控制器：

• 设置范围对象的初始状态。
• 将行为添加到范围对象。

只需将此控制器添加到您的根节点：

app.controller('InitCtrl', function($rootScope, initValues) {
  $rootScope.variable1 = initValue.someVariable;
  $rootScope.variable2 = initValue.anotherVariable;
});

Answer 2

@Cunha：Tnx。

这里有更多细节我是如何做到的：

在网页中：

<script type="text/javascript">
                var variablesFromWebPage = {};
                variablesFromWebPage.phoneNumber = '@Model.PhoneNumber';
</script>

在 Angular 应用程序文件中，注册服务：

var module= angular.module('mymodule', ['ngRoute', 'ngAnimate']);


module.factory('variablesFromWebPage', function () {
    return variablesFromWebPage
});

然后是控制器：

module.controller('IndexController',

    function ($scope, $location, $http, $interval, variablesFromWebPage) {
        $scope.phoneNumber = variablesFromWebPage.phoneNumber;
    }
);