Angularjs makes a simple routing function demo and angularjs routing demo

Angularjs makes a simple routing function demo and angularjs routing demo

Download the latest Angularjs version 1.3.15 from the official website.

Make a simple routing function demo

Home: index.html

<! DOCTYPE html> 
List page: list.html
<Table> <tr> <td> <strong> sender </strong> </td> <strong> content </strong> </td> <strong> date </strong> </td> </tr> <tr ng-repeat = "message in messages"> <td >{{ message. sender }}</td> <a href = "#/view/{message. id }}" >{{ message. subject }}</a> </td> <td >{{ message. date }}</td> </tr> </table>
Details page: detail.html
<Div> <strong> Project: </strong> {message. subject }}</div> <strong> Sender: </strong >{{ message. sender }}</div> <strong> date: </strong> {message. date }}</div> <strong> To: </strong> <span ng-repeat = "recipient in message. recipients ">{{ recipient }}</span> </div> <div >{{ message. message }}</div> <a href = "#/"> return to the list </a>
The following are the pitfalls of this demo:
1: the new version of Angularjs, reference routing function, need to reference the angular-route.js file separately
2: when defining a module, you also need to add a dependency on 'ngroute '.
Angular. module ('xxxx', ['ngroute '])
The above is all the content of this article. I hope you will like it.