Angular:防止在页面编辑时编辑输入字段

时间:2014-07-31 03:12:03

标签: javascript angularjs

我在创建和编辑页面上都使用了Angular文件,但想知道是否有办法阻止用户在/ edit页面上编辑Geo Segment的名称。

enter image description here

地理区域-detail.html:

<nav>
    <a href="#">Geo Segments</a> :
  </nav>

  <h1 class="geo-region-name">{{ geoRegion.name || 'Create Geo Segment' }}</h1>
  <form ng-submit="updateOrAddGeoRegion()" id="regionForm">

    <div class="row">
      <div class="control-group span2">
        <label class="control-label label-unstyled font-size-14" for="inputId">Label</label>
        <div class="controls">
          <input type="text" id="inputId" placeholder="Short name" class="input-small" value="{{ geoRegion.label }}" ng-model="geoRegion.label" required="required">
        </div>
      </div>
      <div class="control-group span4">
        <label class="control-label label-unstyled font-size-14" for="inputName">Name</label>
        <div class="controls">
          <input type="text" id="inputName" placeholder="Region Name" class="input-large" value="{{ geoRegion.name }}" ng-model="geoRegion.name" required="required">
        </div>
      </div>
    </div>
    <div class="control-group">
      <label class="control-label label-unstyled font-size-14" for="inputAddress">Address</label>
      <div class="controls">
        <input type="text" id="inputAddress" placeholder="Address" class="input-xlarge" value="{{ geoRegion.address }}" ng-model="geoRegion.address">
        <google-map-geocoder></google-map-geocoder>
      </div>
    </div>

位置-edit.js:

$scope.newGeoRegion = true
$scope.geoRegionId = ''
$scope.hours = Hours


console.log('$scope.hours', $scope.hours)

$scope.geoRegion = {
  app_id: $scope.app_id
  geoRegion_id: '',
  latitude: 37.7879938,
  longitude: -122.40743739,
  name: '',
  address: '',
  radius: 500,
  customer_id: $scope.customer_id,
  active_daily_clear: false
}

1 个答案:

答案 0 :(得分:3)

正如@Ian所做的那样,但对于&#39;&#39;重视其他原因

ng-disabled="isEdit(geoRegion)"

然后在控制器中

 $scope.isEdit = function(geoRegion) {

            if (angular.isUndefined(geoRegion.geoRegion_id))
                return true;
            if (geoRegion.geoRegion_id == '') 
                return true;

            return false;
 };

如果您决定使用不同的方式来检测编辑,您的isEdit()fn足以屏蔽来自View(html)的更改