Question

我有一个带有控制器的页面，其指令显示带有输入的表单。

指令有一个对象，其中包含表单上显示的所有输入（及其ng-model）。这将表单输入数据绑定到指令内的对象变量。

我需要显示提交表单数据的结果（和其他操作）。

为此，我创建了一个服务来处理业务逻辑和ajax调用。

这里的问题是...... 如何从服务中访问表单数据以执行所需的操作？我考虑过从服务中访问指令变量，但我不确定如何做到这一点，如果这是正确的方式。

Answer 1

service应该包含一个模型，该模型基本上是表单的javascript对象。

directive应注入服务并在其范围（引用）上添加该对象。

directive's template应与directive's scope对话并显示表单。

更改视图上的值将反映服务，因为它们具有相同的引用，并且视图将更新指令范围，因为存在双向绑定。

Answer 2

当然我还在努力工作，但我认为如果你在指令和服务之间添加一个控制器，事情就会更加清晰。这是我一直在玩的基本结构中最紧凑的例子..（原谅咖啡因，如果这不是你的事情）。

angular.module 'app'

.controller 'KeyFormCtrl', (SessionService, $scope, $location, $log) ->
  @error = null
  @message = null
  @keySent = false
  @creds =
    username: null

  @sendKey = ->
    SessionService.sendKey({ username: @creds.username })
    .then(
      (resp) =>
        @keySent = true
      (err) =>
        @error   = err.error
    )

.directive 'eaKeyForm', ->
  {
    restrict: 'AE'
    scope: {}
    templateUrl: 'session/key-form.html'
    replace: true
    controller: 'KeyFormCtrl'
    controllerAs: 'kfc'
    bindToController: true
  }

会话/密钥form.html：

<form>
    <div ng-show="kfc.error">{{kfc.error}}</div>
    <div ng-show="kfc.message">{{kfc.message}}</div>
    <div ng-show="kfc.keySent">
        An account key has been sent to {{kfc.creds.username}}.<br />
    </div>
    <div ng-hide="kfc.keySent">
        <input type="email" ng-model="kfc.creds.username">
        <button ng-click="kfc.sendKey()">Send Key</button>
    </div>
</form>

Answer 3

 angular.module('myApp', [])
     .directive('myAweseomDirective', ['MyAwesomeService', function(MyAwesomeService) {
         return {
             link: function(scope) {

                 scope.saveFormDetails = function() {
                     MyAweseomeService.saveInformation(scope.data);
                     //where data is the ng-model for the form
                 }
             }
         };
}])
.service('MyAweseomService', function() {
    MyAwesomeService.saveInformation = function(data) {
        //do whatever you want to with the data 
    }
});

我应该在指令和服务之间传递数据吗？

3 个答案: