javascript - Angular Breeze 设置

标签 javascript angularjs breeze single-page-application

您好,刚接触 Angular 和 Breeze。我能够让我的 Angular 代码与导航到不同页面一起运行。我需要添加 Breeze ,但是当我将它添加到 MainController 时,它会破坏所有内容,并且开发人员工具不会指定控制台中存在任何问题。我想让我的应用程序至少能够与 Breeze 依赖一起工作。我的索引页面正在调用所有正确的 Breeze 脚本,并且顺序正确。这是我对主 Controller 的设置:

(function () {

    var app = angular.module('app', ['breeze.angular']);
    var breeze = function (breeze) { };
    app.run(['breeze', breeze]);   // Ensure that breeze is minimally configured by loading it when the app runs
    var MainController = function ($scope) {
    };
    app.controller("MainController", MainController);

}());

这是我的index.html页面(我在教程中使用的简单示例):

 <!DOCTYPE html>
    <!-- define angular app -->
    <html ng-app="app">
        <head>
            <!-- Styles -->
            <link href="Content/bootstrap.min.css" rel="stylesheet" />
            <link href="content/css/font-awesome.css" rel="stylesheet" />
            <link href="Content/breeze.directives.css" rel="stylesheet" />

            <!-- Third party Scripts -->
            <script src="Scripts/angular.min.js"></script>
            <script src="Scripts/angular-route.min.js"></script>
            <script src="Scripts/breeze.debug.js"></script>
            <script src="Scripts/breeze.angular.js"></script>
            <script src="Scripts/breeze.directives.js"></script>

            <!--app library-->
            <!--route-->
            <script src="app/route/route.js"></script>
            <!--services-->
            <!--<script src="app/service/dataService.js"></script>-->
            <script src="app/service/dataDropdown.js"></script>
            <script src="app/validator/validator.js"></script>
            <!--jsControllers-->
            <script src="app/jsControllers/BillingController.js"></script>
            <script src="app/jsControllers/Homecontroller.js"></script>
            <script src="app/jsControllers/IncentiveController.js"></script>
            <script src="app/jsControllers/MainController.js"></script>
        </head>

    <!-- define angular controller -->
    <body ng-controller="MainController">
        <nav class="navbar navbar-default">
            <div class="container">
                <div class="navbar-header">
                    <a class="navbar-brand">Forecast</a>
                </div>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="/home"><i class="fa fa-home"></i> Home</a></li>
                    <li><a href="/incentives"><i class="fa fa-home"></i> Incentives</a></li>
                    <li><a href="/billing"><i class="fa fa-home"></i> Billing</a></li>
                </ul>
            </div>
        </nav>
        <div id="main">

            <!-- angular templating -->
            <!-- this is where content will be injected -->
            <div ng-view></div>

        </div>

        <footer class="text-center">
            This is the footer

        </footer>

    </body>
    </html>

最佳答案

我刚刚添加了一个 plunker,即 pretty close to the minimum Breeze/Angular setup

它是这样开始的:

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

app.controller('Main', Main)
   .factory('dataservice', ['breeze', '$q', dataservice]);

将 plunker script.js 与您的代码进行比较,您会发现一些差异。请注意,我推迟了 Breeze/Angular 配置,直到数据服务中首次需要它。我现在更喜欢这种方法,而不是把它扔到 app.run 中。

我不知道你为什么这么写:

var breeze = function (breeze) { };

我猜您正在尝试在 app.run(...) 中放入一些内容,以触发“breeze.angular”模块中“breeze”服务的执行。也许 JavaScript 对此感到困惑(它看起来像递归);这让我很困惑。

关于javascript - Angular Breeze 设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25792487/

相关文章:

javascript - 在 Javascript 中使用变量在调用查询的 cfml 标记内添加功能

javascript - 如何: change css class of a button in a parent window with javascript or jquery?

javascript - Angular:从标签中应用 ngif

javascript - ng-messages-include 不起作用

entity-framework - 使用 Breeze 维护插入订单

breeze - 删除实体及其导航属性

javascript - 选择/检测 d3.js 中更改的元素?

javascript - 如何让 Google Contact API 与 AngularJS 一起工作?

javascript - 将焦点放在 Angular 模板/路线/表单中的文本输入上

javascript - Breeze : calling savecChanges for a classic ODATA service fails