Angularjs 角度用户界面路由器不';更新链接
我正在构建一个基本的rss阅读器,我有一个基本表单,可以将一系列url上传到下拉菜单中,当用户选择一个特定的url时,我调用api来访问它。 我的表格如下:Angularjs 角度用户界面路由器不';更新链接,angularjs,angular-ui-router,Angularjs,Angular Ui Router,我正在构建一个基本的rss阅读器,我有一个基本表单,可以将一系列url上传到下拉菜单中,当用户选择一个特定的url时,我调用api来访问它。 我的表格如下: <div class="panel-body" ng-controller="NewsCtrl"> <form class="form-inline" role="form"> <div class="input-group"> &l
<div class="panel-body" ng-controller="NewsCtrl">
<form class="form-inline" role="form">
<div class="input-group">
<div class="input-group-btn">
<button class="btn btn-info" type="button">{{loadButtonText}}</button>
<button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown"><span class="caret"></span><span class="sr-only">Toggle-dropdown</span></button>
<ul class="dropdown-menu" role="menu">
<li ng-repeat="rss in RSSList">
<a href="#" ng-click="loadFeed(rss.url, $event);">{{rss.Title}}</a>
</li>
</ul>
<input type="text" class="form-control" autocomplete="off" placeholder="This is where your feed's url will appear" data-ng-model="url">
</div>
</div>
</form>
var myApp = angular.module('myAppControllers',[]);
myApp.controller('NewsCtrl', ['$scope','MyService', function($scope, Feed){
$scope.loadButtonText = 'Choose News Feed ';
$scope.RSSList = [
{Title: "CNN ",
url: 'http://rss.cnn.com/rss/cnn_topstories.rss'},
{Title: "CNBC Top News ",
url: 'http://www.cnbc.com/id/100003114/device/rss/rss.html'},
];
//Loading the news items
$scope.loadFeed = function (url, e) {
$scope.url= url;
Feed.parseFeed(url).then(function (res) {
$scope.loadButtonText=angular.element(e.target).text();
$scope.feeds=res.data.query.results.item;
});
}
}]);
我的控制器如下所示:
<div class="panel-body" ng-controller="NewsCtrl">
<form class="form-inline" role="form">
<div class="input-group">
<div class="input-group-btn">
<button class="btn btn-info" type="button">{{loadButtonText}}</button>
<button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown"><span class="caret"></span><span class="sr-only">Toggle-dropdown</span></button>
<ul class="dropdown-menu" role="menu">
<li ng-repeat="rss in RSSList">
<a href="#" ng-click="loadFeed(rss.url, $event);">{{rss.Title}}</a>
</li>
</ul>
<input type="text" class="form-control" autocomplete="off" placeholder="This is where your feed's url will appear" data-ng-model="url">
</div>
</div>
</form>
var myApp = angular.module('myAppControllers',[]);
myApp.controller('NewsCtrl', ['$scope','MyService', function($scope, Feed){
$scope.loadButtonText = 'Choose News Feed ';
$scope.RSSList = [
{Title: "CNN ",
url: 'http://rss.cnn.com/rss/cnn_topstories.rss'},
{Title: "CNBC Top News ",
url: 'http://www.cnbc.com/id/100003114/device/rss/rss.html'},
];
//Loading the news items
$scope.loadFeed = function (url, e) {
$scope.url= url;
Feed.parseFeed(url).then(function (res) {
$scope.loadButtonText=angular.element(e.target).text();
$scope.feeds=res.data.query.results.item;
});
}
}]);
当我改用ui路由器时,我的问题出现了,我知道我必须改变这一行
<a href="#" ng-click="loadFeed(rss.url, $event);">{{rss.Title}}</a>
通过使用UISREF,但只是更改为{{rss.Title}}
仍然没有将我的URL上传到我的NewsCtrl控制器,有什么线索吗
额外的问题:当我在$scope.loadButtonText之前插入一个console.log并打开开发者控制台时,它似乎上传了两次NewsCtrl,这是为什么
ui-sref="app"
应该有用
sref代表“状态”引用,而不是熟悉的“超链接”引用。因此,它将查找使用.state()定义的状态
或者,你可以使用一个好的老式url
href="#/api"
这也会产生同样的效果sref由项目开发人员推荐。ui sref必须指向一个状态,仅此而已。您混淆了ngClick和ngHref/uiSref