将Python列表传递给AngularJS模块

我目前正在创建一个搜索框，该列表将提供从数据库中提取的建议列表，但在将Python列表传递给AngularJS模块时，我无法获得正确的语法。将Python列表传递给AngularJS模块

这是我Python列表：

TaskNameList = [{'id':'1','name':'Alabama'},{'id':'2','name': 'Alaska'}]

我想，我是不是能够在这里得到正确的语法，其中TaskNameList是views.py：

$scope.states = {{ TaskNameList }};

这是我的完整模板代码：

index.html：

<html ng-app="ui.bootstrap.demo"> 
    <head> 
    <script> 
     angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']); 
angular.module('ui.bootstrap.demo').controller('TypeaheadCtrl', function($scope, $http) { 

    $scope.selected = undefined; 
    $scope.states = {{ TaskNameList }}; 
    // Any function returning a promise object can be used to load values asynchronously 
    $scope.getLocation = function(val) { 
    return $http.get('', { 
     params: { 
     sensor: false 
     } 
    }).then(function(response){ 
     return response.data.results.map(function(item){ 
     return item.formatted_address; 
     }); 
    }); 
    }; 

}); 
    </script> 
    </head> 
    <body> 

<div class='container-fluid' ng-controller="TypeaheadCtrl"> 

    <h4>Static arrays</h4> 
    <input type="text" ng-model="selected" typeahead="state as state.name for state in states | filter:{name:$viewValue} | limitTo:8" class="form-control"> 

    </div> 
    </body> 
</html>

来源

2015-09-01 acknolodgia

Django varible在JavaScript访问为“{{TaskNameList}}”。你可以显示'console.log（“{{TaskNameList}}”）'？ – itzMEonTV

一个更好的选择是将数组转换为JSON，像这样：

import json 
TaskNameListJson = json.dumps(TaskNameList)

，并在您的模板（使用安全过滤器HTML转义）：

{{ TaskNameListJson|safe }}

顺便说一句，你应该使用逐字标记，以避免与角模板语法的冲突：https://docs.djangoproject.com/en/1.8/ref/templates/builtins/#verbatim

来源

2015-09-01 08:59:59

将Python列表传递给AngularJS模块

回答

相关问题