不能在AngularJs控制器之间共享数据

大家好，我是AngularJS的新手。这是我的index.html文件http://clip2net.com/s/3oknPG6

<!doctype html>
<html ng-app="app">
    <head>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js"></script>
        <meta charset="utf-8">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Angular route</title>
        <link rel="stylesheet" href="css/style.css">
        <link rel="author" href="humans.txt">
         <script src="angular.js"></script>
        <script src="node_modules/angular-ui-router/release/angular-ui-router.min.js"></script>
        <script src="app/app.js"></script>
        <style>
        body {
            padding: 20px;
        }
        </style>

    </head>
    <body>
    <div ng-view></div>
    <script src="js/main.js"></script>
    </body>
</html>

app.js文件:

angular.module("app", ["ui.router"])

.config(function config($stateProvider){
        $stateProvider.state("index", {
            url:"",
            controller: "FirstCtrl as first",
            templateUrl: "templates/first.html"
        })
    })
.controller("FirstCtrl", function FirstCtrl(){
            var first = this;
            first.greeting = "First";
        });

和first.html文件:

<input type="text" ng-model="first.greeting"/>
    <div ng-class="first.greeting">{{first.greeting}}</div>

我无法在视图中获取数据，请帮我解决这个问题。我也得到这个错误:无法读取未定义的属性'isDefined'。

你在index.html中加载了两次'ui-router'依赖项。也许这就是问题所在?只要在你包含angular.min.js之后加载你的ui路由器就可以了。

我认为问题出在配置上…

controller: "FirstCtrl as first"

有一个可以使用的controllerAs字段。试试这个:

controller: "FirstCtrl"
controllerAs: "first"

这应该有希望解决周围的问题"isDefined"的未定义。Angular会寻找一个名为"FirstCtrl as first"的控制器。

什么是<script src="js/main.js"></script>和also<script src="app/app.js"></script>和你已经加载了两次ui-router，移除<script src="node_modules/angular-ui-router/release/angular-ui-router.min.js"></script>另外，我不确定你想通过写

在view first.html文件中实现什么。

ng-class="first.greeting"

ngClass指令允许你通过绑定一个表示所有要添加的类的表达式来动态地在HTML元素上设置CSS类。关于ng-class的更多信息

相关内容

最新更新

热门标签：