Articles of angular ui router

angular度路线不工作 – 一些模板url错误

我开始与AngularJS,但路由器不工作在我的网站上。 这是一些configuration与我的路线有关: 首先,app.js: // Declare app level module which depends on views, and components angular.module('myApp', [ 'ngRoute', 'myApp.view1' ]). config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) { $locationProvider.hashPrefix('!'); $routeProvider.otherwise({redirectTo: '/'}); }]); 其次,view1.js angular.module('myApp.view1', ['ngRoute']) .config(['$routeProvider', function($routeProvider) { $routeProvider.when('/view1', { templateUrl: '/views/view1/view1.html', controller: 'View1Ctrl' }); }]) .controller('View1Ctrl', [function() { }]); angular.js,app.js和view1.js被添加到index.html ng-view用于显示view1.html中的内容 这是我的文件夹树: 项目 **pipe理员 ****** app.js ****** index.html […]

AngularJS路由在html5mode错误

这里是我的前端AngularJS路由: $urlRouterProvider.otherwise('/'); $locationProvider.html5Mode(true).hashPrefix('!'); $stateProvider .state('main', { url: '/', templateUrl: '/views/main.html', controller: 'MainCtrl' }) .state('review', { url: '/review', templateUrl: '/views/review.html', controller: 'NewReviewCtrl' }) .state('model', { url: '/:make/:model', templateUrl: '/views/model.html', controller: 'ModelPageCtrl' }); 这里是我的服务器端路由(node.js): //…some routes app.use('/*', function(req, res){ res.sendFile(config.rootPath + '/public/index.html'); }); 使用/review路线,一切工作正常,但不与/:make/:model : HTML: <a href="" ui-sref="model({make: 'lenovo', model: 'thinkpad-t430'})">See more details…</a> 如果我通过该链接去到这个页面,一切正常,但如果我刷新或直接进入localhost:3030/lenovo/thinkpad-t430我得到这个错误: Uncaught Error: […]

如何将查询string附加到Angular ui-router中的URL

我对AngularJS很新颖。 我使用ui-router和node.js作为我的UI服务器来调用另一台服务器的API。 现在,我无法将查询string附加到URL,具体取决于用户input(下拉select)。 我的AngularJS控制器代码: $scope.getResults = function() { server.getResults($scope.myColor, $scope.mySize) .success(function(data) { results = data; }); }; 以上function的AngularJS服务: app.factory('server', ['$http', function($http){ return { getResults : function(color, size) { var req = {}; req.color = color; req.size = size; return $http({ method: 'GET', url: 'results', params : req }); } } }]); ui路由器在Angular中: $stateProvider.state('home', { url: […]

将UI路由器状态parsing为无Angular的URL

我有一个Angular 1.5.9 Web应用程序和一个Node.js / Sails.js 0.12后端。 在Angular里面运行UI路由器0.4来处理状态。 状态定义可能看起来像这样(相当香草,我会说): $stateProvider.state('dogs', { url: '/ourdogsarecute_{specialIDofDog} }). state('dogs.specialDogState', { url: '/specialinfo_{specialInfoOfDog}' }); 现在,出现以下情况: 在后端(即在Angular之外) ,我必须转换一个Angular UI路由器状态链接,例如{stateName: 'dogs.specialDogState', stateParams: {specialIDofDog: 11212, specialInfoOfDog: 'likesbones' } }转换为有效的url,例如https://www.our-app.dog/ourdogsarecute_11212/specialinfo_likesbones 。 我不知道如何做到这一点,没有大量的手动工作。 是否有一种用于UI路由器状态的parsing器作为节点模块? 我可以以某种方式访问​​后端状态定义所在的前端代码。 这不是问题。 问题是从状态链接到URL的转换。

ui路由器不能从nodejs文件夹工作,但在plunker上工作

UI路由器应该做一个index.html作为一个标题和test.html作为附加的看法,但它不能在我的电脑出于某种原因。 Plunker一个伟大的工作。 index.html与plunker相同 <html ng-app="MyApp"> <head> <link href="stylesheets/style.css" rel="stylesheet"> </head> <body> <h4> This should be the header </h4> <div ui-view></div> <script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script> <script data-require="ui-router@*" data-semver="0.2.10" src="https://rawgit.com/angular-ui/ui-router/0.2.10/release/angular-ui-router.js"></script> <script src="app.js"></script> <script src="controllers/main.js"></script> </body> </html> views / test.html只包含 <div> this is test.html </div> 和app.js包含 angular.module('MyApp', [ 'ui.router' ]) .config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/'); $stateProvider .state('main', { url: […]

如何从服务器(node.js)检索MongoDB数据到我的AngularJS路由

这是我的Server.js文件(NodeJS): var express = require('express'); var server= require('http'); var path= require("path"); var bodyParser = require('body-parser'); var mongoose = require('mongoose'); var app= express(); var staticDIR = path.resolve(__dirname, "./www");“ app.use(express.static(staticDIR)); app.use(bodyParser.json()); app.get("*", function (req, res) { var indexViewPath = path.resolve(__dirname, "./www/index.html"); res.sendFile(indexViewPath); }); var dbURI = 'mongodb://localhost:27017/mydatabase'; mongoose.connect(dbURI); mongoose.connection.on('connected', function () { console.log('Mongoose connected to ' + […]

如何安装angular-ui-router.js文件,而不是从npm完整的源代码解决scheme?

当我从节点包pipe理器( npm )安装angular包时,我在angular根目录下得到了需要的JS文件。 $npm install angular 但是,当我安装angular-ui-router软件包时,我得到了完整的源代码解决scheme,并且需要位于release目录下的JS文件。 $npm install angular-ui-router 有没有办法从npm安装所需的JS文件,而不是整个源代码解决scheme?

Meanjs:发生器错误:未知提供者:MenusProvider < – 菜单

我使用下面的命令创build了新的模块 $ yo meanjs:crud-module <module-name> 但在创build模块后,我得到下面的错误,我的意思是应用程序不运行,除了显示控制台错误的白页 rror: [$injector:unpr] Unknown provider: MenusProvider <- Menus http://errors.angularjs.org/1.5.3/$injector/unpr?p0=MenusProvider%20%3C-%20Menus return new ErrorConstructor(message); 我正在使用以下版本的发电机 — generator-meanjs@0.4.4 任何人都可以打电话给我什么是错误的。 我的模块名称是客户

快速路由:如何在静态文件上返回404错误,并为angular色UI路由器维护HTML5Mode

我有一个AngularJS网页使用ui路由器在HTML5Mode路由,这意味着URL不必有“index.html#”既不是“#”。 为了达到这个目的,我将自己的expressconfiguration为ui-router wiki : app.use('/app', express.static(__dirname + '/../web/app')); app.use('/css', express.static(__dirname + '/../web/css')); app.use('/img', express.static(__dirname + '/../web/img')); app.use('/libs', express.static(__dirname + '/../web/libs')); app.use('/views', express.static(__dirname + '/../web/views')); app.all('/*', function(req, res, next) { res.sendFile(path.resolve(__dirname + '/../web/index.html')); }); 重要的部分是最后一行,所有调用不匹配app / css / img … return index.html 它的工作原理,问题来了,因为我有另一个规则返回公共文件: // Return file app.use('/file', express.static(__dirname + "/../public/", options)); 在angular度的应用程序中,我使用$ http来获取公共文件(文件名是URL上的一个参数),如果文件存在,我使用它: var fileUrl = […]

AngularJS,ocLazyLoad和ui-router:如何在主app.js类没有集中“状态”的情况下按需加载

我在ui-router和ocLazyLoad上很新,可能这个问题可能很容易解决,但是我写在这里是因为我没有在博客上search。 我的应用程序现在正在运行ocLazyLoad。 这是我的主要app.js类的configuration: angular.module('me', [ 'ui.router', 'oc.lazyLoad', 'me.partials.footer', 'me.partials.header' ]) .config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/ini') $stateProvider .state('ini', { // Login url: '/ini', templateUrl: 'views/ini/ini.html' }) .state('signin', { url: '/signin', templateUrl: 'views/signin/signin.html' }) .state('home', { url: '/home', templateUrl: 'views/home/home.html', resolve: { home: function($ocLazyLoad) { return $ocLazyLoad.load( { name: "views.home", files: [ "views/home/home.js", ] } […]