如何在RequireJs中使用ng-app？

问题描述

我正在学习RequireJs，我很难理解如何在我的HTML中使用Angular指令，这些指令需要已加载角度。

I'm learning RequireJs and I'm stumped on how to use Angular directives in my HTML that require angular to already be loaded.

考虑这个例子 -

index.html：

<script src="myUrl/require.js" data-main="js/main.js"></script>
<div ng-app="myApp">
  ...
</div>

main.js：

requirejs.config({
    baseUrl: 'js',
    paths : {
        'angular' : 'myUrl/angular.min',
        },
    shim : {
        'angular' : {
            exports: 'angular'
        },
        'myApp':{
            deps: ['angular']
        }
    },
    deps : ['angular', 'myApp']
});

myApp.js：

require(['angular'], function(angular){
    angular.module('myApp',[]);
});

运行此代码将获得模块不可用错误，这让我觉得 myApp 代码还没有运行它，因为RequireJs仍在转动它的轮子。如何避免这种明显的竞争条件？

Running this code will get me a Module Unavailable error, which makes me think that the myApp code just hasnt been run it because RequireJs is still spinning its wheels. How can I avoid this apparent race condition?

推荐答案

当您使用RequireJS动态加载Angular时，您应该删除 ng-app 属性并使用。

When you load Angular dynamically with RequireJS, you should drop the ng-app attribute and initialize your application with angular.bootstrap.

这篇关于如何在RequireJs中使用ng-app？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！