從Django url內的angularjs傳遞ID

我創建了一個過濾的搜索列表，以從數據庫中搜索一些項目並將它們顯示在列表視圖中。我想要做的是顯示項目作爲鏈接到他們的詳細信息頁面。因爲我使用Django和AngularJS工作存在{{}}從他們兩個，所以我寫之間的衝突，下面的代碼：從Django url內的angularjs傳遞ID

myApp.config(function($interpolateProvider) { 
        $interpolateProvider.startSymbol('//'); 
        $interpolateProvider.endSymbol('//'); 
     });

，但是當我試圖通過點擊的的ID項目的網址，它不再工作。我試圖做到這一點我用AngularJS以前做相同的，但我收到以下錯誤：

Reverse for 'line_details' with arguments '('',)' and keyword arguments '{}' not found. 1 pattern(s) tried: ['baierlab/lines/line/(?P[0-9]+)/details']

現在，代碼是這樣的：

的詳細信息頁面的網址：

url(r'^lines/line/(?P<line_id>[0-9]+)/details', views.line_details, name='line_details'),

在模板的頭：

<script type="text/javascript"> 
     var myApp = angular.module('myApp', []); 

     myApp.config(function($interpolateProvider) { 
        $interpolateProvider.startSymbol('//'); 
        $interpolateProvider.endSymbol('//'); 
     }); 

     myApp.controller('FilterInputCtrl', function($scope,$rootScope) { 

      $scope.items1 = []; 

      {% for line in lines %} 

       $scope.items1.push 
       ({ 
        id:{{ line.id }}, 
        name:'{{ line.name }}', 
       }); 

      {% endfor %} 
     }); 
    </script>

在身：

<body> 

    <div id="selection_list" class="container item_padding"> 

     <div ng-controller="FilterInputCtrl" > 

      <div class="row"> 
       <div class="col-md-6 col-sm-6 col-xs-12"> 
        <input class="form-control" type="text" ng-model="item1" placeholder="Enter your item"> 
        <br /> 
        <ul class="list"> 

         <li ng-repeat="x in items1 | filter:item1 | orderBy:'name'"> 
          <a href="{% url 'line_details' x.id %}">//x.name//</a> 

         </li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    </div> 
</body>

來源

2015-12-19 نوار مكيس

你得到的錯誤是非常自然的。語句{% url 'line_details' x.id %}正在服務器級別處理，遠在角度接管客戶端級別之前。

這是初學者網絡開發中經常出現的誤解。你需要清楚地分開django和angular的邏輯。前者使服務器中發生的事情發生。它準備了一個對客戶端（瀏覽器）的響應，其中角度啓動並「編譯」（如角度喜歡命名它）。

個人而言，我處理這個以下列方式：

在Django模板我有一個特定<script>部分定義的服務器準備的角度JS選項，包括任何URL使用方法：

<script> 
    var o = { 
     url: '{% url 'line_details' %}', 
     // ... 
    }; 
</script>

另請注意，你需要從你的url中刪除參數，使用http get包括它，例如：lines/line/details?id=x。使用$http對象後面的角度操作也更容易。

然後，您需要在您的控制器中構建您的url並將其綁定到您的<a>鏈接中。

當然上面的方法不是唯一的，並且有一定的要求很複雜，但是你得到了一般的想法。

在symmary中，將您的django邏輯從您的角度邏輯中分離出來，更易於調試和開發。

來源

2015-12-19 10:23:30 Wtower

從Django url內的angularjs傳遞ID

回答

相關問題