angularjs에서의 단방향 바인딩과 쌍방향 바인딩의 차이

angularjs에서의 단방향 바인딩과 쌍방향 바인딩의 차이

어떻게 다른지 설명해주실래요?One-way Data Binding그리고.Two-way Data Binding예를 들어 어떤 상황을 사용했는가?

단방향 데이터 바인딩

ng-bind단방향 데이터 바인딩이 있음(Model($scope) --> View)예.ng-bind="myText"또는{{ myText }}

스코프 값을 표시합니다.$scope.myTextHTML에 삽입할 수 있습니다.myText는 스코프 변수 이름입니다.(예: 모델 -> 표시)

양방향 데이터 바인딩

ng-model주로 폼 요소 안에 넣기 위한 것으로 양방향 데이터 바인딩이 있습니다.

(Model($scope) --> View and View --> Model($scope))

예.<input name="firstname" ng-model="firstname"/>

양식 요소와 상호 작용하는 경우firstname어느것에게ng-model와 상호 작용하다$scope.firstname해당하는 뷰를 자동으로 갱신합니다.Digest사이클(예: 모델 -> 표시 및 표시 -> 모델)

일회성 데이터 바인딩

새로운 구문에 의해::원하는 값(단방향 또는 양방향) 앞에 있습니다.one time binding:

<p>
  {{ ::firstname }}
</p>

한번만firstname정의되고 값, 각도가 포함됩니다.JS는unbind모델 업데이트는 뷰에 영향을 주지 않습니다.

예: ng-if를 사용하는 경우

<div ng-if="::user.firstname"></div>

ng-class를 사용하는 경우

<div ng-class="::{ 'active': user.firstname }"></div>

usine ng-repeat시

<ul>
  <li ng-repeat="user in ::users"></li>
</ul>

한 가지 방법 바인딩은 모델 간에 데이터를 바인딩하는 것입니다.또한 양방향 바인딩은 모델에서 보기 및 보기와 모델로 데이터를 바인딩하는 것입니다.

UI에서 데이터 바인딩은 UI 필드를 데이터 모델에 바인딩하는 것입니다.데이터 바인딩에는 단방향 데이터 바인딩과 양방향 데이터 바인딩의 두 가지 접근 방식이 있습니다.

단방향 데이터 바인딩 -> 모델은 진실의 단일 소스입니다. UI에서 어떤 일이 일어나든 메시지를 모델에 트리거하여 데이터의 일부를 업데이트합니다.따라서 데이터는 단방향으로 흐르기 때문에 이해하기 쉬워집니다.

양방향 데이터 바인딩 -> UI 필드를 변경하면 모델이 업데이트되고 모델을 변경하면 UI 필드가 업데이트됩니다.

단방향 데이터 흐름으로 인해 단방향 데이터 바인딩이 더 나은 접근 방식입니다.또한 모델만 응용 프로그램 상태를 변경할 수 있습니다.

언급URL : https://stackoverflow.com/questions/38626156/difference-between-one-way-binding-and-two-way-binding-in-angularjs