Databases
StackOverflow2013
Postsdbo
POAngularJS Routes strange behaviour
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAngularJS Routes strange behaviour
    text
    copied!<p>I'm trying to reproduce an example of AngularJS app in the book. My problem : when I go on index.html, nothing happens, and I am redirected on index.html#/ I don't understand... Thank you</p> <p><strong>Index.html</strong></p> <pre><code>&lt;html ng-app="AMail"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;Title...&lt;/title&gt; &lt;link rel="stylesheet" href="css/bootstrap.min.css"&gt; &lt;link rel="stylesheet" href="css/custom.css"&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"&gt;&lt;/script&gt; &lt;script src="js/controllers.js"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;h1&gt;A-Mail&lt;/h1&gt; &lt;div ng-view&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p><strong>List.html</strong></p> <pre><code>&lt;table&gt; &lt;tr&gt; &lt;td&gt;&lt;strong&gt;Sender&lt;/strong&gt;&lt;/td&gt; &lt;td&gt;&lt;strong&gt;Subject&lt;/strong&gt;&lt;/td&gt; &lt;td&gt;&lt;strong&gt;Date&lt;/strong&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr ng-repeat="message in messages"&gt; &lt;td&gt;{{message.sender}}&lt;/td&gt; &lt;td&gt;&lt;a href="#/view/{{message.id}}"&gt;{{message.subject}}&lt;/a&gt;&lt;/td&gt; &lt;td&gt;{{message.date}}&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; </code></pre> <p><strong>Controller.js</strong></p> <pre><code>// Creates a module for our core AMail services var aMailServices = angular.module('AMail', []); // Set up our mappings between URLs, templates, and controllers function emailRouteConfig($routeProvider){ $routeProvider. when('/', { controller: ListController, templateURL: 'list.html' }). // Notice that for the detail view, we specify a parameterized URL component // by placing a colon in front of the id when('/view/:id', { controller: DetailController, templateURL: 'detail.html' }). otherwise({ redirectTo: '/' }); } // Set up our route so the AMail service can find it aMailServices.config(emailRouteConfig) // Some fake emails messages = [{ id: 0, sender: 'jean@somecompany.com', subject: 'Hi there, old friend', date: 'Dec 7, 2013 12:32:00', recipients: ['greg@somecompany.com'], message: 'Hey, we should get together for lunch sometime and catch up.' +'There are many things we should collaborate on this year.' }, { id: 1, sender: 'maria@somecompany.com', subject: 'Where did you leave my laptop?', date: 'Dec 7, 2013 8:15:12', recipients: ['greg@somecompany.com'], message: 'I thought you were going to put it in my desk drawer.' +'But it does not seem to be there.' }, { id: 2, sender: 'bill@somecompany.com', subject: 'Lost python', date: 'Dec 6, 2013 20:35:02', recipients: ['greg@somecompany.com'], message: 'Nobody panic, but my pet python is missing from her cage.' +'She doesn\'t move too fast, so just call me if you see her.' } ]; // Publish our messages for the list template function ListController($scope){ $scope.messages = messages; } // Get the message id from the route (parsed from the URL) and use it to // find the right message object function DetailController($scope, $routeParams){ $scope.message = messages[$routeParams.id]; } </code></pre> <p>Thank you</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload