Question

我是Angularjs的新手。我创建了一个小程序，用于在form-submit上获取输入，并使用控制器函数将其添加到json数据。

这似乎是程序中的一个小错误，但我无法找到它。

请帮助：下面是我的 angjs.html （其中定义了表单）和 app.js （对于控制器和json数据）：< / p>

angjs.html

<body>
    <div ng-controller="loginController as login">
        <div ng-repeat="user in login.users">
            <h2>{{user.username}}</h2>
            <h3>{{user.password}}</h3>
        </div>
        <form name="loginUser" ng-controller="FeedDataController as feedCtrl" ng-submit="feedCtrl.addUser(user)">
            <!-- Live preview -->
            <div>
                <h2>{{feedCtrl.user.username}}</h2>
                <h3>{{feedCtrl.user.password}}</h3>
            </div>
            <!-- form submit -->
            <input type="text" ng-model="feedCtrl.user.username" name="username" /><br />
            <input type="text" ng-model="feedCtrl.user.password" name="password" /><br />
            <input type="submit" value="GO" />
        </form>
    </div>
</body>

app.js

(function(){
var app = angular.module('login',[]);

app.controller('loginController',function(){
    this.users = user;
});

app.controller('FeedDataController',function(){
    this.user={};
    this.addUser=function(user){
        user.push(this.user);
        this.user={};
    };
});

var user = [
{username: 'Azurite',    password: 'hello',    canPurchase: false,    soldOut: true  },
{username: 'Blinge',    password: 'right',    canPurchase: false,    soldOut: true  }
];

Answer 1

用户和用户之间存在拼写错误

plunker：http://plnkr.co/edit/tn5pwxidy0uf3rnlGUHT?p=preview

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

app.controller('loginController',function(){
    this.users = users;
});

app.controller('FeedDataController',function(){
    this.user={};
    this.addUser=function(){
        users.push(this.user);
        this.user={};
    };
});

var users = [
  {username: 'Azurite',    password: 'hello',    canPurchase: false,    soldOut: true  },
  {username: 'Blinge',    password: 'right',    canPurchase: false,    soldOut: true  }
];
});

Answer 2

在ng-submit="feedCtrl.addUser(user)"中使用user，这是未定义的。更改为ng-submit="feedCtrl.addUser(feedCtrl.user)"

Answer 3

您还没有在app.js中正确关闭IIFE功能：

(function(){
var app = angular.module('login', []);

app.controller('loginController',function(){
    //var vm = this;
    this.users = user;
});

app.controller('FeedDataController',function(){
    //var vm = this;    
    this.user={};
    this.addUser=function(user){
        user.push(this.user);
        this.user={};
    };
});

var user = [
{username: 'Azurite',    password: 'hello',    canPurchase: false,    soldOut: true  },
{username: 'Blinge',    password: 'right',    canPurchase: false,    soldOut: true  }
];

})();

Angularjs控制器功能不起作用

3 个答案: