programing

AngularJS: 모델에 대한 2방향 바인딩을 선택하지 않음

magicmemo 2023. 2. 25. 20:52
반응형

AngularJS: 모델에 대한 2방향 바인딩을 선택하지 않음

선택 항목을 사용하여 클라이언트 이름을 표시하고 있습니다.사용자는 기존 클라이언트를 선택할 수 있어야 합니다.이 경우 스코프 속성이 갱신됩니다.

컨트롤러

"첫 번째 선택" 초기화 중.

if($scope.clients.length > 0) $scope.existingClient = $scope.clients[0];

보다

<select
    id='nm-existing-client-name'
    class='form-control  input-lg'
    ng-model='existingClient'
    ng-options="client.name for client in clients">
</select>

범위 속성existingClient선택 메뉴가 변경되어도 변경되지 않습니다.값이 초기화되지 않은 경우(위의 컨트롤러 회선이 제거됨) 값은existingClient정의되지 않은 상태로 남습니다.

의 접속ng-change값은 변경되지만 모델 자체는 새 값으로 업데이트되지 않습니다.

Angular를 사용하고 있습니다.JS v1.2.0-rc.3.

아마 당신은 아동용 스코프를 사용하고 있을 것이고, 그것을 모르는 것 같습니다. ng-if,ng-repeat,ng-switch그리고.ng-include모두 하위 범위를 만듭니다.범위의 값은 상속되지만 하위 범위의 값을 변경하면 하위 범위에 값이 설정되고 상속된 값은 상위 범위에서 변경되지 않습니다.대신 오브젝트를 사용하여 값을 고정하고 그것이 수정되는지 확인합니다.개체에만 속성을 설정하고 범위에는 직접 값을 설정하지 않으므로 상위 범위의 상속된 개체가 사용되고 값이 업데이트됩니다.

$scope.data = {
    existingClient: $scope.clients.length > 0 ? $scope.clients[0] : undefined
};

표시:

<select ng-model="data.existingClient" 
        ng-options="client.name for client in clients">
</select>

Angular를 사용할 수 있습니다.범위를 디버깅하는 데 도움이 되는 크롬의 JS Batarang 확장자.

또한 $scope 객체에 파라미터를 유지하는 솔루션이기도 합니다.

컨트롤러:

$scope.scope = $scope;
$scope.clients = [];
$scope.existingClient = $scope.clients.length > 0 ? $scope.clients[0] : undefined;

표시:

<select ng-model="scope.existingClient" ng-options="client.name for client in clients"></select>

언급URL : https://stackoverflow.com/questions/19408883/angularjs-select-not-2-way-binding-to-model

반응형