首页 > 代码库 > Angular 1.63 双向数据绑定 通过 $http 发送数据

Angular 1.63 双向数据绑定 通过 $http 发送数据

html 部分

<body ng-app="app">
<form action="" method="">账号
<div ng-controller="login">

<label for=""><input type="text" ng-model="data.name" name="name" id="" value="" /></label>      //  ng-model="data.name"的数据进行绑定绑定
<br />
<label for="">密码<input type="text" ng-model="data.password" name="password" id="" value="" /></label>      //  ng-model="data.password"的数据进行绑定绑定
<br />
<input type="button" ng-click="login()" value="http://www.mamicode.com/登录" />          //绑定点击事件login()

</div>
</form>
</body>

------------------------------------------

script部分

<script type="text/javascript">
var app = angular.module("app", [])
app.controller("login", function($scope, $http) {     //注入依赖
$scope.data = http://www.mamicode.com/{
name: "",
password: ‘‘
};
$scope.login = function() {                //创建点击事件发送数据
console.log($scope.data);
$http.post("/login", $scope.data)        //post发送数据
.then(function(result) {}, function(error) {});  //两个回掉函数   一个是成功回调   一个是失败回调

}

})
</script>

-------------------------------

总结     双向数据绑定

1 创建一个 $scope.data  

2将$scope.data   绑定在相应 input上 使用 ng-model绑定

 

 angular 传送数据

1.在controller 注入依赖 $http

2.创建发送数据的函数

post方法    $http.post(‘/someUrl‘, data, config).then(successCallback, errorCallback);

post方法   $http.get(‘/someUrl‘, config).then(successCallback, errorCallback);

Angular 1.63 双向数据绑定 通过 $http 发送数据