如何在laravel输入框中调用AngularJs函数

Question

我有一个HTML表单。我可以成功地使用这种形式的角度js。 但是，当我使用laravel表单构建器转换该表单字段时，出现错误。

这是我简单的HTML和AngularJs，它的做工精细

var app = angular.module('mainApp', []); 
 
app.controller('availableDay', function($scope) { 
 
    $scope.dayfrom = ""; 
 
    $scope.dayto = ""; 
 
    $scope.dayfull = function() { 
 
    return $scope.dayfrom + "-" + $scope.dayto; 
 
    } 
 
});

<div class="form-group"> 
 
    <div class="row" ng-app="mainApp" ng-controller = "availableDay"> 
 
     <div class="col-lg-12"> 
 
      <h4 class="page-header">Available in a week</h4> 
 
      <div class="col-lg-6"> 
 
       <div class="form-group"> 
 
        <label>Day From</label> 
 
        <select class="form-control" ng-model = "dayfrom"> 
 
         <option>Monday</option> 
 
         <option>Tuesday</option> 
 
         <option>Wednesday</option> 
 
         <option>Thursday</option> 
 
         <option>Friday</option> 
 
         <option>Saturday</option> 
 
         <option>Sunday</option> 
 
        </select> 
 
       </div> 
 
      </div> 
 
      <div class="col-lg-6"> 
 
       <div class="form-group"> 
 
        <label>Day To</label> 
 
        <select class="form-control" ng-model="dayto"> 
 
         <option>Monday</option> 
 
         <option>Tuesday</option> 
 
         <option>Wednesday</option> 
 
         <option>Thursday</option> 
 
         <option>Friday</option> 
 
         <option>Saturday</option> 
 
         <option>Sunday</option> 
 
        </select> 
 
       </div> 
 
      </div> 
 

 
      <div class="col-lg-12"> 
 
       <div class="form-group"> 
 
        <label>Available Day</label> 
 
        <input class="form-control" type="text" value="{{dayfull()}}"> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

但是，当我将转换为使用laravel表单生成它时出错

语法错误，意外'}'

var app = angular.module('mainApp', []); 
 
     app.controller('availableDay', function($scope) { 
 
      $scope.dayfrom = ""; 
 
      $scope.dayto = ""; 
 
      $scope.dayfull = function() { 
 
       return $scope.dayfrom + "-" + $scope.dayto; 
 
      } 
 
     });

<div class="form-group"> 
 
    <div class="row" ng-app="mainApp" ng-controller = "availableDay"> 
 

 
     <div class="col-lg-12"> 
 
      <h4 class="page-header">Available in a week</h4> 
 
      <div class="col-lg-6"> 
 
       <div class="form-group"> 
 

 
        {{ Form::label("day from","Day From ") }} 
 
    
 
        {{ Form::select('day_from', [ 
 
         'Monday' => 'Monday', 
 
         'Tuesday' => 'Tuesday', 
 
         'Wednesday' => 'Wednesday', 
 
         'Thursday' => 'Thursday', 
 
         'Friday' => 'Friday', 
 
         'Saturday' => 'Saturday', 
 
         'Sunday' => 'Sunday'], null, ['class' => 'form-control', 
 
         'ng-model' => 'dayfrom'] 
 
        ) }} 
 
        
 
       </div> 
 
      </div>  
 

 
      <div class="col-lg-6"> 
 
       <div class="form-group"> 
 
        {{ Form::label("day to","Day To ") }} 
 
    
 
        {{ Form::select('day_to', [ 
 
         'Monday' => 'Monday', 
 
         'Tuesday' => 'Tuesday', 
 
         'Wednesday' => 'Wednesday', 
 
         'Thursday' => 'Thursday', 
 
         'Friday' => 'Friday', 
 
         'Saturday' => 'Saturday', 
 
         'Sunday' => 'Sunday'], null, ['class' => 'form-control', 
 
         'ng-model' => 'dayto'] 
 
        ) }} 
 
       </div> 
 
      </div> 
 

 
      <div class="col-lg-12"> 
 
       <div class="form-group"> 
 
        {{ Form::label("available day","Available Day ") }} 
 

 
        {{ Form::text("available_day", {{dayfull()}}, ["class" => "form-control"]) }} 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我如何使用AngularJs功能{{dayfull（）}}里Laravel表单生成器？

Answer 1

这里的部分问题是你不能以这种格式使用它。 blade和angularjs标记冲突，如here所示。你可以得到它周围的一个方法是连接标记，所以当它呼应，angularjs应该处理它：

{{ Form::text("available_day", '{{'.'dayfull()'.'}}', ["class" => "form-control"]) }}