标签 angular.js 下的文章

angular1路由route遇到#!【解决】

angular1 双向数据绑定已经基本掌握,今天用路由angular-route,遇到#后多出一个感叹号! 。路由不能正常使用。
开始就感觉是angular版本的问题,查资料
果然,使用angular 1.6.0以上版本,需要在配置路由config加上

$locationProvider.hashPrefix('');

$location服务解析地址栏中的URL(基于window.location),让你在应用代码中能获取到。改变地址栏中的URL会反应$location服务中,反之亦然。
http://www.angularjs.cn/A00M

'use strict';

angular.module('MyApp', [
'ngRoute',
'myApp.in_theaters',
'myApp.coming_soon',
'myApp.top250'
]).
config(['$routeProvider', '$locationProvider',function($routeProvider,$locationProvider) {
$locationProvider.hashPrefix('');
$routeProvider.otherwise({redirectTo: '/in_theaters'});
}]);

可以正常使用。

angular1控制器主要作用(大致思路)

初始化module数据(为应用中的模型设置初始状态)
用过$scope对象把数据模型或函数行为暴露给视图
监视模型的变化,做出相应动作

 <!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<table ng-controller="muController">
    <tr>
        <td>用户名:</td>
        <td><input type="text" ng-model="user.username"/></td>
    </tr>
    <tr>
        <td>密码:</td>
        <td><input type="password" ng-model="user.password"/></td>
    </tr>
    <tr>
        <td><input type="button" value="登陆" ng-click="login()"/></td>
    </tr>
</table>
<script src="node_modules/angular/angular.js"></script>
<script>
    var app = angular.module("myApp", []);
    app.controller("muController", ["$scope", function ($scope) {
        $scope.user = {
            username: '',
            password: ''
        }
        $scope.login = function () {
            console.log($scope.user);
        }
    }])
</script>
</body>
</html>