问题描述
<!DOCTYPE html><html lang='en-us' ng-app='myApp'> <head><title>Document</title><meta http-equiv='X-UA-Compatible' content='IE=Edge'><meta charset='UTF-8'><!-- load bootstrap and fontawesome via CDN --><link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css' integrity='sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u' crossorigin='anonymous'><style> html, body, input, select, textarea {font-size: 1.05em; }</style><!-- load angular via CDN --> <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js'></script><script src='https://www.6hehe.com/wenda/app.js'></script> </head> <body><header> <nav class='navbar navbar-default'> <p class='container'><p class='navbar-header'> <a href='https://www.6hehe.com/'>AngularJS</a></p><ul class='nav navbar-nav navbar-right'> <li><a href='https://www.6hehe.com/wenda/14108.html#'><i class='fa fa-home'></i> Home</a></li></ul> </p> </nav></header><p class='container'> <p ng-controller='mainController'> <p> <label>What is your twitter handle?</label> <input type='text' ng-model='handle' /></p><p ng- ng-if='handle.length !== characters'> <p ng-show='handle.length < characters'>You have less than 5 characters! </p> <p ng-show='handle.length > characters'>You have more than 5 characters! </p> </p><hr /><h1>twitter.com/{{ lowercasehandle() }}</h1><h3>Rules</h3><ul> <li ng-repeat='rule in rules'>{{ rule.RuleName }} </li></ul>Add rule: <input type='text' ng-model='newRule' /><a href='https://www.6hehe.com/wenda/14108.html#' ng-click='addRule()'>Add</a> </p> </p> </body></html>
//app.jsvar myApp = angular.module(’myApp’, []);myApp.controller(’mainController’, [’$scope’, ’$filter’,’$http’,function ($scope, $filter,$http) { $scope.handle = ’’; $scope.characters = 5; $scope.lowercasehandle = function () {return $filter(’lowercase’)($scope.handle); } $http.get(’/angularjs/http/api.json’) .success(function(result){ $scope.rules = result; }) .error(function (data,status) { console.log(data); }) $scope.newRule = ’’; $scope.addRule = function () {$http.post(’/angularjs/http/api’, { newRule: $scope.newRule }) .success(function (result) {console.log(result);$scope.rules = result;$scope.newRule = ’’; }) .error(function (data, status) {console.log(data); }); };}]);
//api.json[ { 'ID':1, 'RuleName':'Must be 5 characters' },{ 'ID':2, 'RuleName':'Must be 5 characters' },{ 'ID':3, 'RuleName':'Must be 5 characters' }]
能get到数据,但是post的时候没有更新json数据,和Accept:application/json, text/plain, */* 这个有关吗?该怎么解决。。
问题解答
回答1:get的时候随便一个本地的服务器或者不用服务器直接读取json文件就能得到数据。但是如果你想把页面上更改的内容保存回去,就需要服务端代码来处理,angular 本身的$http是没有进行文件写入的功能的。想保存数据的话,post的接口需要有对应的代码逻辑进行文件操作才行。
回答2:贴后端处理json数据的代码吧,骚年!