각 컨트롤러

에서 레이블 텍스트를 업데이트 할 수 없습니다 AngularJS와 컨트롤러의 범위 변수에 바인딩 앵커 태그와 HTML 페이지에서 선택 드롭 다운, 드롭 다운 a는있다.각 컨트롤러

기능 : 드롭 다운의 선택된 값 변경이,이 앵커 태그 텍스트에 반영하도록되어 때마다 .

문제 : 컨트롤러가 처음으로 초기화 할 때, 드롭 다운에서 값이 설정됩니다하지만 레이블의 텍스트가 인구하지 않습니다.

각도 코드 : HTML 페이지

init = function() { 
    $scope.month = {'val': ''}; 
    // some intermediate code which populates month 

    $("#element-id").val($scope.month.val); 

    var i = $("#element-id").closest(".element-panel"); 
    var t = i.find(".element-label"); 
    t.text(element.children(":selected").text()); 
} 

init();

AController.js

에서 : 이미 ng-model="month.val"과 결합 될 때

<div class="element-panel"> 
    <a class="select-label element-label" id="">Month</a> 
    <select id="element-id" ng-model="month.val"> 
    <option value="" style="display:none;"></option> 
    <option value="1">January</option> 
    <option value="2">February</option> 
     <!-- more options ... --> 
    <option value="12">December</option> 
    </select> 
</div>

출처

2016-06-06 comiventor

은'$ ("# element-id")를 사용합니다. parents (". 요소 패널 : 첫 번째")' –

는 작업 fiddle이다.

HTML :

이

<a class="select-label element-label" ng-model="label">{{selected.label}}</a> 
<select id="element-id" ng-model="selected" ng-options="opt.label for opt in months">

컨트롤러 : 당신의 컨트롤러에 jQuery를 사용하여

$scope.months = [ 
    {id: '1', label: "January"}, 
    {id: '2', label: "February"}, 
    {id: '3', label: "December"} 
]; 
$scope.selected = {label: 'Month'};

마십시오. DOM 조작은 다른 곳에서 처리되어야합니다 (지시문 등).

출처

2016-06-06 13:32:27 amu

$("#element-id").val가 불필요한해야

코드입니다 귀하의 HTML에.

은 왜 그냥 당신을 위해 바인딩을해야

<a class="select-label element-label">{{month.val}}</a>

에 라벨을 변경? 당신이하려고하는 것처럼 컨트롤러에서 DOM을 조작하는 것을 피하는 것이 가장 좋은 방법입니다. 대신 지시문을 사용할 수 있습니다.

출처

2016-06-06 13:09:18

HTML 코드,

<a>{{monthName}}</a> 
    <select ng-model="month.val" ng-options="month.Id as month.Name for month in months track by month.Id" 
     ng-change="GetValue()"> 
    </select>

Angula JS 코드,

  $scope.months = [{ 
       Id: 1, 
       Name: 'jan' 
      }, { 
       Id: 2, 
       Name: 'feb' 
      }, { 
       Id: 3, 
       Name: 'mar' 
      }]; 

      $scope.GetValue = function (fruit) { 
       $scope.monthId = $scope.month.val; 
       $scope.monthName = $.grep($scope.months, function (month) { 
        return month.Id == $scope.monthId; 
       })[0].Name; 

      }

month.val 선택한 달의 ID를 포함합니다. 옵션 선택에

는 getValue 함수가 호출됩니다.

이 기능은 $scope.months에서 달의 ID를 기반으로 월 이름을 찾을 수 있습니다. 시도해보십시오. 여기

출처

2016-06-06 13:23:30

각 컨트롤러

답변

관련 문제