我的 Submitpost 功能不工作
My Submitpost function isn't working
第一次使用 angularJs,我正在关注 AngularJS reddit 克隆教程,但我不知道哪里出错了。当我点击提交按钮时没有任何反应。 https://github.com/Eibonic/AngularJS-reddit/tree/master/app
这是nav.js控制器
'use strict';
app.controller('NavCtrl', function ($scope, $location, Post, Auth)
{
$scope.post = {url: 'http://', title: ''};
$scope.submitPost = function ()
{
Post.create($scope.post).then(function (ref)
{
$scope.post = {url: 'http://', title: ''};
$location.path('/posts/' + ref.name());
});
};
});
这是 nav.html 视图文件。
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">ang-news</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div ng-controller="NavCtrl" class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<form class="navbar-form navbar-left" role="search" ng-submit="submitPost()">
<div class="form-group">
<input type="text" class="form-control" placeholder="Title" ng-model="post.title">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Link" ng-model="post.url">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div><!-- /.navbar-collapse -->
</nav>
我查看了您链接的 github 项目,有两个问题;我通过 运行 项目并在 Chrome 中打开调试控制台找到了它们。
Unknown provider: AuthProvider <- Auth <- NavCtrl
在英语中,这意味着您试图将 Auth
提供程序(不存在)作为 NavCtrl 中的依赖项注入。这是 nav.js 的第 3 行。您实际上还没有使用 Auth 服务,因此只需将其从您的函数声明中删除即可修复它。它应该是这样的:
app.controller('NavCtrl', function ($scope, $location, Post)
一旦您到达教程中创建 Auth 提供程序的位置,您就可以在此处注入它。
第二个错误是GET http://localhost:9000/scrips/controllers/postview.js 404
这意味着 HTML 试图加载 postview.js 脚本,但找不到它。原来在加载脚本时第 89 行的 index.html 中有一个错字。它应该是 http://localhost:9000/scripts/controllers/postview.js
(缺少 'scripts' 中的 't')
进行这两项更改后,它现在似乎工作正常。
第一次使用 angularJs,我正在关注 AngularJS reddit 克隆教程,但我不知道哪里出错了。当我点击提交按钮时没有任何反应。 https://github.com/Eibonic/AngularJS-reddit/tree/master/app
这是nav.js控制器
'use strict';
app.controller('NavCtrl', function ($scope, $location, Post, Auth)
{
$scope.post = {url: 'http://', title: ''};
$scope.submitPost = function ()
{
Post.create($scope.post).then(function (ref)
{
$scope.post = {url: 'http://', title: ''};
$location.path('/posts/' + ref.name());
});
};
});
这是 nav.html 视图文件。
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">ang-news</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div ng-controller="NavCtrl" class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<form class="navbar-form navbar-left" role="search" ng-submit="submitPost()">
<div class="form-group">
<input type="text" class="form-control" placeholder="Title" ng-model="post.title">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Link" ng-model="post.url">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div><!-- /.navbar-collapse -->
</nav>
我查看了您链接的 github 项目,有两个问题;我通过 运行 项目并在 Chrome 中打开调试控制台找到了它们。
Unknown provider: AuthProvider <- Auth <- NavCtrl
在英语中,这意味着您试图将 Auth
提供程序(不存在)作为 NavCtrl 中的依赖项注入。这是 nav.js 的第 3 行。您实际上还没有使用 Auth 服务,因此只需将其从您的函数声明中删除即可修复它。它应该是这样的:
app.controller('NavCtrl', function ($scope, $location, Post)
一旦您到达教程中创建 Auth 提供程序的位置,您就可以在此处注入它。
第二个错误是GET http://localhost:9000/scrips/controllers/postview.js 404
这意味着 HTML 试图加载 postview.js 脚本,但找不到它。原来在加载脚本时第 89 行的 index.html 中有一个错字。它应该是 http://localhost:9000/scripts/controllers/postview.js
(缺少 'scripts' 中的 't')
进行这两项更改后,它现在似乎工作正常。