Angular JS - 将 ng-model 添加到在表单中调用的指令中

Question

我正在尝试制作一个日期选择器，它是为表单[=]填写输入文本 42=]。我为那个叫做“datepicker”的东西创建了一个指令。

但现在我遇到了一个问题，我不能在指令上使用“ng-model”，我不知道如何解决这个问题。日期选择器中的输入需要填写范围“projetData.dateConception”并且需要通过表单读取。

DatePickerDirective.js:

app.directive("datepicker", function(){ return { restrict: 'E', replace: true, transclude: true, scope: {}, templateUrl: './partials/datepicker.html', link: function(scope, element, attrs){ scope.datepicker = {}; scope.datepicker.montListShowed = false; . . .

addProjetView.html

<div class = "fiche-line" ng-show="displayField.DateConception"> <span class="fiche-field-title">Date Conception : </span> <datepicker ng-model="projetData.dateConception" ></datepicker> </div> <div class = "fiche-line" ng-show="displayField.DateSolution"> <span class="fiche-field-title">Date Solution : </span> <input type="date" ng-model="projetData.dateSolution" > </div>

datepicker.html（指令模板）

<div class="datepicker-relative datepicker-no-touch"> <input ng-model="datepicker.dateSelected" class="inputDate" ng-focus="datepickerVisible = true" type="text"></input> <div class="datepicker-popup" ng-show="datepickerVisible"> . . .

表单中的输入：

正在填充输入的日期选择器

总而言之，我想让<datepicker>生成的输入能够读取“projetData.dateConception”，修改它。然后表单在提交时将其发送到我的数据库。（已完成）

Answer 1

感谢您的回复，现在可以使用了！

这就是我现在的代码：

DatePickerDirective.js :

app.directive("datepicker", function(){
return {
    restrict: 'EA',
    replace: true,
    require: 'ngModel',
    transclude: true,
    scope: { ngModel : '='},
    templateUrl: './partials/datepicker.html',
    link: function(scope, element, attrs){

        scope.datepicker = {};

addProjetView.html

<div class = "fiche-line" ng-show="displayField.DateConception">
     <span class="fiche-field-title">Date Conception : </span> 
     <datepicker ng-model="projetData.dateConception" ></datepicker>
</div>

datepicker.html（指令模板）

<div class="datepicker-relative datepicker-no-touch">
        <input ng-model="ngModel" class="datepicker-input-date" type="date"></input>
</div>

Angular JS - 将 ng-model 添加到在表单中调用的指令中

Angular JS - Add ng-model to directive which is called in form

html

directive

datepicker

angularjs

angular-ngmodel