我需要传递并接收两个参数到我想转移到使用ui-srefui-router的状态.
比如使用以下链接将状态转换为homewith foo和bar参数:
<a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home state with foo and bar parameters </a>
控制器中的接收foo和bar值:
app.controller('SomeController', function($scope, $stateParam) {
//..
var foo = $stateParam.foo; //getting fooVal
var bar = $stateParam.bar; //getting barVal
//..
});
我在控制器中得到undefined了$stateParam.
有人可以帮我理解如何完成它吗？
编辑:
.state('home', {
url: '/',
views: {
'': {
templateUrl: 'home.html',
controller: 'MainRootCtrl'
},
'A@home': {
templateUrl: 'a.html',
controller: 'MainCtrl'
},
'B@home': {
templateUrl: 'b.html',
controller: …是否可以从angular.js网址中删除#符号？
当我更改视图并使用params更新URL时,我仍然希望能够使用浏览器的后退按钮等,但我不想要#符号.
教程routeProvider声明如下:
angular.module('phonecat', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}).
when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
otherwise({redirectTo: '/phones'});
}]);
如果没有#,我可以编辑它以具有相同的功能吗？
我正在学习AngularJS,有一件事让我很烦.
我用来$routeProvider为我的应用程序声明路由规则:
$routeProvider.when('/test', {
controller: TestCtrl,
templateUrl: 'views/test.html'
})
.otherwise({ redirectTo: '/test' });
但是当我在浏览器中导航到我的应用程序时,我看到了app/#/test而不是app/test.
所以我的问题是为什么AngularJS将此哈希添加#到网址？有没有可能避免它？
我的印象是Angular会重写在tempaltes中的锚标记的href属性中出现的URL,这样无论是在html5模式还是hashbang模式下它们都能正常工作.位置服务的文档似乎说HTML链接重写处理了hashbang情况.因此,我希望在不在HTML5模式下,插入哈希值,并且在HTML5模式下,它们不会.
但是,似乎没有重写.以下示例不允许我只更改模式.应用程序中的所有链接都需要手动重写(或者在运行时从变量派生.我是否需要根据模式手动重写所有URL？
我没有在Angular 1.0.6,1.1.4或1.1.3中看到任何客户端URL重写.似乎所有href值都需要以#/为hashbang模式和/为html5模式.
是否有必要进行重写？我误读了文档吗？做些别傻话？
这是一个小例子:
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.3/angular.js"></script>
</head>
<body>
<div ng-view></div>
<script>
angular.module('sample', [])
.config(
['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
//commenting out this line (switching to hashbang mode) breaks the app
//-- unless # is added to the templates
$locationProvider.html5Mode(true);
$routeProvider.when('/', {
template: 'this is home. go to <a href="/about"/>about</a>'
});
$routeProvider.when('/about', {
template: 'this is about. go to <a href="/"/>home</a'
});
}
])
.run();
</script>
</body>
附录:在重新阅读我的问题时,我发现我使用了"重写"一词,但没有明确说明我何时以及何时进行重写.问题是如何让Angular在呈现路径时重写URL,以及如何在两种模式下统一解释JS代码中的路径.它不是关于如何使Web服务器执行HTML5兼容的请求重写.
我正在使用angular-ui-router库,我遇到了URL问题.
我有以下代码:
app.js:
app.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('state', {
url: '/state',
templateUrl: 'templates/state.html',
onEnter: function () {
/*... code ...*/
}
})});
index.html的:
<a href="#/state">STATE</a>
这有效,但是当我从<a>标签中删除"#"时,这不起作用.
如何从网址中删除"#"符号？
我在AngularJS路由方面遇到了很大的问题.
直到最近,一切都很好,有以下路线:
$routeProvider.when('/album/:albumId', {
controller: 'albumPageController',
templateUrl: 'views/album.html'
});
并使用href:
<a href="/#/album/{{album.id}}">Link</a>
但是,现在所有的斜杠都被编码成了%2F.
因此,当我单击链接或键入localhost:8000/#/album/1浏览器时,URL将更改为:
我已经尝试了几件事来纠正这个问题:
使用ng-href代替href,不使用第一个/(即href="#/album/{{album.id}}")在Homestead localhost(Laravel的linux vagrant机器)中运行应用程序而不是Windows 10上的localhost
任何帮助将非常感激!
我刚注意到在我的所有路线中都有哈希(#!)之后我有感叹号,我不知道我是如何以及为什么我得到它们因为今天我没有它们,是否有任何解决方案可以摆脱它们如果有人能解释我是什么,以及我是如何得到的,我将不胜感激.因此,到目前为止我找到的解决方案只是在我的应用程序中的每个href上手动设置感叹号,但是这让我烦恼,我不知道该怎么做.我使用yeoman生成器生成了我的应用程序,我的app.js看起来像这样
angular
.module('appNameApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
.when('/about', {
templateUrl: 'views/about.html',
controller: 'AboutCtrl',
controllerAs: 'about'
})
.when('/jaspo', {
templateUrl: 'views/about.html',
controller: 'jaspoCtrl',
controllerAs: 'vm'
})
.otherwise({
redirectTo: '/'
});
});
我有一个angularJS应用程序,是一个画廊.对于每一个图像,相关联的与它是一个ng-href用#/{{files.id}}.
<a ng-href="#/{{files.id}}"...
但是,当我单击它时,最终显示的URL是
http://localhost:3000/gallery#%2F0
它破坏了我的角度路由
when('/gallery/:imageID', {
templateUrl: 'load_image.html'
}).
有人可以向我解释如何正确编码URL吗？或者只使用不编码正斜杠的东西？
我正在尝试创建我的第一个角度应用程序.但它根本不起作用.我不知道是什么问题.我检查了控制台,但没有错误.
<head>
<meta charset="utf-8">
<script src="https://code.angularjs.org/1.6.0/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular-route.js"></script>
</head>
<body ng-app="myApp">
<h1>Test angular</h1>
<a href="#/">Main</a>
<a href="#sec">Second</a>
<a href="#th">Third</a>
<div ng-view></div>
</body>
<script>
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "main.html"
})
.when("/sec", {
templateUrl : "sec.html"
})
.when("/th", {
templateUrl : "th.html"
});
});
</script>
谁能帮我？
当我点击这个:<a href="#/home">home</a>网址是localhost/Sites/App/#!/#%2Fhome
当我点击这个:<a href="#!/home">home</a>网址是localhost/Sites/App/#!/home
但这仅适用于我的计算机,对于我的同事则相反,如果!网址中有链接,则链接不起作用.
我了解SEO最佳实践,但我们没有公共网站,我们需要在网址中使用没有感叹号的网站.
我理解/url是编码的,因为有角度认为这不是路径分隔符,但为什么在我唯一的计算机？我们有相同的代码.
我们使用IIS或IIS express,Chrome或IE,没有任何区别.当它适用于我时,它不适用于所有其他人.
在浏览器网络调用中,我们可以看到链接上的点击和坏网址生成之间没有服务器调用.
这是模块配置:
angular.module('paper.app', [ 'ngMaterial'
, 'ngMessages'
, 'ngRoute'
, ...])
.config(function ($routeProvider, $mdThemingProvider, $mdIconProvider, $locationProvider, $mdDateLocaleProvider, contentUrl, contentSvg) {
$routeProvider
.when("/", {
templateUrl: contentUrl + 'view-home/html/home.html',
controller: 'HomeController',
controllerAs: 'homeCtrl'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(false);
...
});
这是bower.json:
{
"name": "...",
"version": "1.0.0",
"authors": [
"..."
],
"ignore": [
"node_modules",
"bower_components"
],
"description": "",
"main": "",
"homepage": "",
"dependencies": …我正在构建一个AngularJS应用程序,在构建第二个视图时我遇到了URL问题:
我的appContact.js看起来像这样:
(function () {
"use strict";
var app = angular.module("appContacts", ["simpleControls", "ngRoute"])
.config(function ($routeProvider, $locationProvider) {
$routeProvider.when("/", {
controller: "contactsController",
controllerAs: "vm",
templateUrl: "/views/contactsView.html"
});
$routeProvider.when("/details/:firstName", {
controller: "contactsDetailsController",
controllerAs: "vm",
templateUrl: "/views/detailsView.html"
});
$routeProvider.otherwise({ redirectTo: "/"});
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
});
})();
在我的HTML中,我有这个链接:
<a asp-controller="Contact" asp-action="Details" ng-href="#/details/{{contact.firstName}}" >{{ contact.firstName}}</a>
当我在浏览器中悬停时,我有正确的建议链接,如:
**http://localhost:8000/#/details/Matthew**
但是,当我单击链接导航到新页面时,URL将更改为
**http://localhost:8000/#%2Fdetails%2FMatthew**
通过%2更改"/"会使应用程序失败并显示空白页面.
你知道为什么会这样,以及如何纠正这个问题？
我已经阅读了类似的帖子,但是它们似乎都没有用,因为我在访问编码器的URL到达浏览器之前没有访问它并且错误就在那里.
谢谢
拉斐尔
我正在将其他人制作的一个现有的小型 Angular JS 应用程序集成到一个不是用 Angular 构建的现有网站中。
所有 Angular JS 应用程序文件都保存在一个完全独立的目录中，然后用户可以单击链接将它们带到该子目录的索引。例如：
<a href="/path/to/angular-app/?returnUrl=/original/location">Login.</a>
正如您在上面看到的，我需要传递一个名为returnUrl. 然后我需要在 Angular JS 应用程序中获取这个值，使用：
<a href="/path/to/angular-app/?returnUrl=/original/location">Login.</a>
然而，这实际上返回一个空对象。我认为这是因为 Angular JS在 URL 参数之后附加#!/login在URL 上，如下所示：
example.com/path/to/app?returnUrl=/original/location/#!/login
如果我在浏览器中修改 URL，将returnUrl参数移动到 URL 的末尾并刷新页面，它会工作并$location.search()返回{returnUrl: "/original/location/"}. 但是，据我所知，我无法在我的网站上更改此参数，因为该参数是指向 Angular JS 应用程序的链接的一部分，#!/login随后会自动添加。
我是新的 AngularJS，所以请尽可能清楚地解释：
#!/login？$location.search()返回任何东西？如果我将参数移动到结果 URL 的末尾，它就可以工作。我们正在开发带有哈希标签导航的 SPA。在另一个 SPA 网站上看到有散列标签 URL，如http://example.com/#!/users 我们的应用程序当前实现散列标签 URLS 没有 ! （bang，感叹号）像http://example.com/#/users 在 URL 中使用 bang 标记有什么原因吗？我已经检查了一些 SO 问题，一些文档： URL hash-bang (#!/) 前缀而不是 Angular 1.6 中的简单哈希 (#/) 人们希望摆脱他们的 SPA 中的感叹号。
但是，Angular Changelog 指出在 URL 中添加 bang 标记是一个重大变化：https : //github.com/angular/angular.js/blob/master/CHANGELOG.md#location-due-to
Google 的文档还显示了一个带有感叹号的示例：https : //developers.google.com/webmasters/ajax-crawling/docs/getting-started
我的主要问题是 - 我们需要在哈希 URL 中使用感叹号吗？这有什么意义吗？
提前感谢您的回答！
angularjs ×12
javascript ×9
routing ×2
url ×2
angular-ui ×1
asp.net ×1
hash ×1
hashtag ×1
href ×1
html ×1
iis ×1
laravel ×1
ngroute ×1
url-routing ×1