在angular.js中从JSON文件中查询和返回数据

Consulting and returning data from JSON file in angular.js

本文关键字:查询 返回 数据 文件 angular js 中从 JSON      更新时间:2023-09-26

我是angularjs新手,我有一些PHP和Rails的背景。

我正在制作一个简单的应用程序用于学习目的,在这个应用程序中,我将要求一个首都并给出国家,反之亦然。

我可以使用ui-router和很多我不知道的angular的东西,但我遇到了麻烦,特别是在de数据获取。

我的de capital --> state功能服务是:

.factory('CidadeFactory', ['$http', function($http) {
var vm = this;
vm.data = [] 
return $http.get('../dados.json')
.success(function(data) {
    vm.data = data;
    console.log(data)
})
.error(function(err) {
    console.log(err);
})

我的控制器(还没有功能)是这样的:

angular.module('appUi').controller('CidadeCtrl', ['CidadeFactory',function(CidadeFactory){ }])  

这个状态的html是:

<form action="">
    <fieldset>
        <label for="input-cidade">Type the capital name</label>
        <input type="text"   />
    </fieldset>
</form>

和my .json:

{"itens": [
{ "state": "Rio Grande do Sul", "capital": "Porto Alegre " },
{ "state": "Santa Catarina", "capital": "Florianópolis" },
{ "state": "Paraná", "capital": "Curitiba" },
{ "state": "São Paulo", "capital": "São Paulo" },
{ "state": "Rio de Janeiro", "capital": "Rio de Janeiro" },
{ "state": "Minas Gerais", "capital": "Belo Horizonte" },
{ "state": "Espirito Santo", "capital": "Vitória" } ]}

我的问题是:我应该做些什么来获得输入的值,在我的json文件中,这个值是返回相对状态。例如:如果表单值是Curitiba,我应该返回paran

我应该使用下划线。js进行数据操作吗?

并且出于最佳实践的原因:在工厂中获取数据,在控制器中操作数据,这是更好的方法吗?还是有更好的方法?

建立链接的一种常用方法是观察控制器中文本字段的模型,并将回调函数绑定到它,该回调函数从工厂检索数据。

underscore.js用于数据操作听起来是个好主意,我不觉得有什么问题。

模板中:<input type="text" ng-model="enteredCapital" />Your state is {{state}}

在控制器中:$scope.$watch('enteredCapital', function() { //call factory and do your thing $scope.state = state; //return the state-value back to the template });