I used the stateprovider with an html page.
$stateProvider
.state('about', {
url: '/about',
templateUrl: 'pages/about.html
});
But i changed the about file to about.php and also in the code below.
$stateProvider
.state('about', {
url: '/about',
templateUrl: 'pages/about.php
});
It still seems to link to about.html somehow, because if I delete the about.html and keep about.php it is not working
Im wondering how I can use the .php file extention in the stateprovider.
EDIT:
Okay so this does work on my personal hosting space but not on external hosting on one.com. Any idea how to fix this?
Related
I have an angular app where I am using ui-router module. I am storing a "page" in database with URL and content. I also have some other states/URLs that have their own template. For example:
$stateProvider
.state('landing', {
url: '/',
templateUrl: 'landing-page.html'
})
.state('admin', {
url: '/admin',
templateUrl: 'admin.html'
})
.state('user', {
url: '/user',
templateUrl: 'user.html'
})
I want to define a state for the pages using something like
.state('page',{
url: '??',
templateUrl: 'page.html'
})
What should be in the url above if my page is dynamically stored in database with a URL/slug and content. How can I add the URL/slug here ? If I try this below:
.state('page', {
url: '/{path:.*}',
templateUrl: 'page.html'
})
Then it routes every page including the other states to the same template. I can always prefix the URL with something like /page but I don't want to do that. I want to be able to load the page as :
www.mysite.com/page-1
www.mysite.com/whatever-url
etc
Never mind. I figured this out. The trick was more about using regular expression. Here is my solution
.state('page', {
url: '/{path:(?!admin|user)[a-z0-9\-]+}',
templateUrl: 'page.html'
})
This will ignore routes starting with /admin and /user which we want first. Then, it will check if the url has at least 1 character.
I'm using AngularJS for my front end web framework and was wondering how I can change the routing of my states so that when i go to my website, it would say (for example) abc.com rather than abc.com/home. I am using StateProvider to switch between views and this as default home url
state('home', {
url: '/home',
templateUrl: 'pages/home.html',
}).
$urlRouterProvider.otherwise('/home');
I have this in my index.html
<div ui-view></div>
I want to keep my home page content in a separate file from index.html, yet always not show that url so I would not see "/home" at all whenever I use the website. How can I do this?
state('home', {
url: '/',
templateUrl: 'pages/home.html',
})
$urlRouterProvider.otherwise('/');
You need to change the URL in the route definition to / instead of /home.
I'm using angularjs ui-router with this stateProvider:
.state("admin", {
abstract:true,
url: "/admin",
templateUrl: "/app/template/adminabstract.html",
controller: "AdminAbstractController"
})
.state("admin.view1", {
url: "/view1",
templateUrl: "/app/template/adminview1.html",
controller: "AdminView1Controller"
}).state("admin.view2", {
url: "/view2",
templateUrl: "/app/template/adminview2.html",
controller: "AdminView2Controller"
})
Here is the current localhost link:
http://localhost:52058/index.html#/admin/view2
It works just fine in localhost, however when I publish to the server it no longer works. Here is what the link looks like on the server:
http://specific.com/appname/otheridentifier/index.html#/admin/view2
For my app to work when it is published I think I need to change my ui-router config or state provider so my localhost is
http://localhost:52058/index.html#/appname/otheridentifier/admin/view2
Am I on the right track? What do I need to do to make this work?
Since your website doesn't look like its in the root of the site you cant do
templateUrl: "/app/template/adminview1.html"
the / is saying look at the root of this website so it looks at
http://specific.org/app/template
you would want to change your template address to
templateUrl: "/appname/otheridentifier/app/template/adminview1.html"
I'm using ui-router in Angularjs and I have the following routes (as part of my app.js file):
...
$urlRouterProvider.otherwise('/dashboard');
$stateProvider
.state('home', {
url: '/',
templateUrl: 'views/home.html',
data: { public: true }
})
.state('login', {
url: '/login',
templateUrl: 'views/login.html',
data: { login: true }
})
...
I have decided to keep the # in my routes because ui-router doesn't work too well with the html5 setting for routing without the hash.
Question: When I navigate to localhost:8080/ I would expect my home state to kick in but it goes to /dashboard (the otherwise route). I can only access the root of my site with localhost:8080/#/ - is this expected behaviour?
Not the answer for the question, but you might want to take a look at http://angular-route-segment.com for this case, as it works on top of built-in ngRoute module which plays well with html5 mode as well.
I've set up ui-router states like so:
$stateProvider
.state("login", {
url: "/Login",
templateUrl: "login.html",
controller: "LoginController"
})
.state("createBooking",
{
url: "/CreateBooking",
templateUrl: "createBooking.html",
controller: "CreateBookingController"
})
.state("calendarView", {
url: "/ViewBookings",
templateUrl: "calendarView.html",
controller: "CalendarController"
});
which works fine when running on the localhost (e.g. //localhost:[port]/Login)
However, when I push to the dev server under a virtual directory 'SiteName' (e.g. //dev.server.com/SiteName/Login) then the virtual directory part of the path is stripped out (e.g. //dev.server.com/Login)
It also affects all of my services, as it's looking at //server/serviceName instead of //server/directory/serviceName
When I push the site to staging/production, I'll be using different paths again.
How can I set up ui-router to properly handle my various paths?
So it turned out that I needed to remove the html5mode.
$locationProvider.html5Mode(true);
it now works with the urls showing as //dev.server.com/SiteName/index#/Login