我想知道是否有人可以快速了解我的代码并让我知道我是否缺少任何内容。 我正在尝试学习Angular.js,并且一直在60分钟的视频中使用著名的Angular.js 但是,我的问题是此后角度已更新,并且情况有所不同。 结果,我无法正确地安排路线。 非常感谢任何人提前。

我真正想知道的是,为了使这些路线正常工作,有人能告诉我我所缺少的是什么吗?

这是我在HTML中的脚本。 我遵循了本书,因此它们是index.html页面中的脚本标签。

var demoApp = angular.module('demoApp', ['helperModule']);
    var controllers = {};

    demoApp.controller("CustomersController",  function ($scope){
        $scope.customers = [
                {name: 'Dave Jones', city: 'pheonix'},
                {name: 'Dave Jones', city: 'New york'},
                {name: 'Jones suman', city: 'pheonix'},
                {name: 'Naresh babu', city: 'Hyderabad'}
            ];
        });
    var demoApp = angular.module('demoApp', ['ngRoute']);
        demoApp.config(function($routeProvider){
            $routeProvider
                .when('/',
                    {
                        controller: "SimpleController",
                        templateUrl: "views/view1.html"
                    })
                .when('partial2',
                    {
                        controller: "SimpleController"
                        templateUrl: "views/view2.html"
                    })
                .otherwise({ redirectTo: "/"})
        });

        $scope.addCustomer = function(){
            $scope.customers.push({name: $scope.newCustomer.name, city: $scope.newCustomer.city});
        }
<script src = "angular-route.js"></script>

这分别是我的视图#1和视图#2的内容。 我觉得一切都正确,但是我无法显示任何客户的名字。

<div cass = "container">
<h2>View 1</h2>
    Name: 
    <input type = "text" data-ng-model="filter.name" />
    <ul><li data-ng-repeat="cust in customers | filter:filter.name"></ul>
    Customer Name: <br />
    <input type= "text" data-ng-model="newCustomer.name" />
    Customer City: <br />
    <input type= "text" data-ng-model="newCustomer.city" />
    <button data-ng-click="addCustomer()"> Add Customer </button>   
    <a href="#/view2"> View 2</a>   
</div>



<div cass = "container">
<h2>View </h2>
<div ng-controller="CustomersController">
    Search: <input type = "text" ng-model="searchText" />
    {{ searchText }}
    <br />
    <h3> Customers </h3>
    <table>
        <tr ng-repeat="cust in customers | filter:city">
                <td>{{ cust.name }}</td>
                <td>{{ cust.city }}</td>
                <td>{{ cust.total | currency}} </td>
            </tr>
    </table>
</div>

#1楼 票数:4 已采纳

您正在覆盖出现问题的应用

var demoApp = angular.module('demoApp', ['helperModule']); 然后再次声明了demoApp var demoApp = angular.module('demoApp', ['helperModule']);

解决此问题的更好方法是只声明一次具有所有依赖项的应用,并继续使用控制器,指令,工厂等组件对其进行修改。

//could remove `helperModule` module if not used
var demoApp = angular.module('demoApp', ['helperModule', 'ngRoute']); 
demoApp.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            controller: "SimpleController",
            templateUrl: "views/view1.html"
        })
        .when('partial2', {
            controller: "SimpleController",
            templateUrl: "views/view2.html"
        })
        .otherwise({
            redirectTo: "/"
        })
});

demoApp.controller("CustomersController", function($scope) {
    $scope.customers = [{
        name: 'Dave Jones',
        city: 'pheonix'
    }, {
        name: 'Dave Jones',
        city: 'New york'
    }, {
        name: 'Jones suman',
        city: 'pheonix'
    }, {
        name: 'Naresh babu',
        city: 'Hyderabad'
    }];

    $scope.addCustomer = function() {
        $scope.customers.push({
            name: $scope.newCustomer.name,
            city: $scope.newCustomer.city
        });
    };
});

  ask by kdweber89 translate from so

未解决问题?本站智能推荐:

2回复

AngularJs中的函数问题

我是Angular的初学者,我对函数有疑问。 我有一个简单的代码。 因为有两个警报来探测它们没有被调用。 的HTML 我的JavaScript: 我也有app.js 还有我的index.html 当我按下mandar按钮时,什么也不会发生。 谁能告诉
2回复

在60分钟内角化-该代码有什么问题?

我已经开始学习Angular,并在60分钟之内开始学习Angular。 在第48页上,有一个如下所示的示例代码,它是一个simple controller用于在页面中显示customers属性的内容。 <!DOCTYPE html> <html ng-app=
1回复

AngularJS模块工厂服务问题

我写了一个简单的工厂服务。 在这里,小提琴的链接http://jsfiddle.net/#&togetherjs=caUQB0merH我无法确定为什么小提琴无法正常工作。 有人可以指出问题吗 提前致谢 更新:-
3回复

$ scopeProvider的问题

我有一个如下的js文件。 当我加载页面时,出现如下错误。 错误:[$ injector:unpr]未知提供程序:$ scopeProvider <-$ scope <-inputResourceService <-inputResourceDirective
2回复

角度工厂服务问题

我正试图让我的头脑围绕Angular服务。 我创建了一个简单的示例,但是当我尝试使用该服务时,控制台会发出错误(参见下文) app.js service.js UserController.js view.html 该视图正确显示$scope.number
1回复

错误:[$ injector:unpr]未知提供程序:路由时,角度Js中的$ scope

这段代码给出了错误错误:[$ injector:unpr]未知提供程序:$ scope。 我在标题使用这些行
2回复

使用UI路由器从AngularJS中的根控制器访问范围值

我有一个简单的要求,我需要在index.html页面上显示$scope.resAVal的值。 我在$scope.resAVal中有$scope.resAVal RootCtrl 。 的index.html 这是app.js : 这是它的plunker。 有人可以帮我
2回复

Angular JS:我们可以在未定义路由的控制器上设置解析或承诺吗?

我试图在控制器获取渲染之前从服务器获取一些数据。 对于routeProvider我已经找到了许多答案。 但是我的主要问题是我的控制器未绑定任何路由。 那么有什么办法可以做到这一点? 我有以下几种方式的控制器...