码迷,mamicode.com
首页 > Web开发 > 详细

[AngularJS] angular-formly: Default Options

时间:2015-05-13 06:12:33      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:

angular-formly allows you to keep your forms as DRY as possible. TheoptionsTypes property is one way of composing your field configurations to keep your forms light-weight and DRY.

 

/* global angular */
(function() {
  
  ‘use strict‘;

  var app = angular.module(‘formlyExample‘, [‘formly‘, ‘formlyBootstrap‘]);
  
  app.run(function(formlyConfig) {
    formlyConfig.setType({
      name: ‘ipAddress‘,
      defaultOptions: {
        templateOptions: {
          label: ‘IP Address‘,
          placeholder: ‘127.0.0.1‘
        },
        validators: {
          ipAddress: function($viewValue, $modelValue) {
            var value = $modelValue || $viewValue;
            return !value || validateIpAddress(value);
          }
        }
      },
      controller: function($scope) {
        console.log($scope);
      }
    });
    
    function validateIpAddress(value) { 
      return value && /(\d{1,3}\.){3}\d{1,3}/.test(value);
    }
    
  });

  app.controller(‘MainCtrl‘, function MainCtrl() {
    var vm = this;
    // funcation assignment
    vm.onSubmit = onSubmit;

    // variable assignment
    vm.model = {};
    vm.fields = [
      {
        type: ‘input‘,
        key: ‘ipAddress‘,
        optionsTypes: [‘ipAddress‘],
        templateOptions: {
          label: ‘My IP Address‘
        }
      }
    ];
    
    
    // copy fields because formly adds data to them
    // that is not necessary to show for the purposes
    // of this lesson
    vm.originalFields = angular.copy(vm.fields);
    
    // function definition
    function onSubmit() {
      alert(JSON.stringify(vm.model), null, 2);
    }
  });

})();

 

[AngularJS] angular-formly: Default Options

标签:

原文地址:http://www.cnblogs.com/Answer1215/p/4499229.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!