我該如何獲取輸入值？

Question

我在嘗試獲取這些輸入的值並將它們與“ book”對象相關聯時遇到很大的問題，當您單擊“立即預訂！”時

無論我在js中的何處聲明對象，它都不會起作用。 它是針對這樣的對象的：

  $scope.book = { bday_i : new date(day, month, year), bday_f : book(bday_i), bfrom : getHours(bday_i), buntil : getHours(bday_i), bresource : "Small meeting room ", bmember : "Lucas Gabriel da Costa", busercredit : ("4 hours left of", book(bresource)), bcoment : "Test" } 

我嘗試獲取值並將其分配給這樣的變量：

  $scope.book.bday_i = myForm.day_i.value; $scope.book.bday_f = myForm.day_f.value; $scope.book.bfrom = myForm.from.value; $scope.book.buntil = myForm.until.value; $scope.book.bresource = myForm.resource.value; $scope.book.bmember = myForm.member.value; $scope.book.busercredit = myForm.usercredit.value; $scope.book.bcoment = myForm.coment.value; $modalInstance.close(result); 

  $scope.dayClick = function (date, jsEvent, view, value) { $scope.newEventDate = date; var t = '<div class="modal-header">' + '<h5>New booking</h5>' + '</div>' + '<form ng-model="myForm" name="myForm" id="myForm">'+ '<div class="modal-body" name="box" >' + '<p>Time: ' + ' ' + '<pre >' + ' Initial date:' + '<input id="day_i" class="form-control" type="date" name="day_i" ng-model="day_i" type="text" min = "dia_hj" value="dia_hj" required /> ' + ' Final date:' + '<input id="day_f" class="form-control" type="date" name="day_f" ng-model="day_f" type="text" min = "day_i" value="dia_hj" required /> ' + ' From:' + ' <input id="from" class="form-control" name="from" ng-model="from" type="time" min = "getHours()" value="" required />' + ' Until' + ' <input id="until" class="form-control" name="until" ng-model="until" type="time" min = "myForm.from.value" value="" required /> </pre></p>' + '<p> Resource:' + ' <pre><input id="resource" class="form-control" name="resource" ng-model="resource" type="text" placeholder ="Ex: Small Meeting Room" value="" required /></pre></p> ' + '<p> Member: ' + ' <pre><input id="member" class="form-control " name="member" ng-model="member" type="text" placeholder="Ex: Lucas Gabriel da Costa" value="" required /> </pre></p> ' + '<p> User credit:' + ' <pre><input id="usercredit" class="form-control" name="usercredit" ng-model="usercredit" type="text" placeholder="Ex: 4 hours included(Small meeting Room)" value="" required /></pre></p>' + 'Note:' + '<pre><textarea id="coment" ng-model = "coment" name="coment" rows="4" cols="46" placeholder="Insert ur comment"></textarea></pre></form>' + // validação: '<div ng-hide= " myForm.day_i.$pristine">' + '<span ng-show="myForm.day_i.$error.required " class="alert alert-danger"> The INITIAL DATE camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide= " myForm.day_f.$pristine">' + '<span ng-show="myForm.day_f.$error.required || (myForm.day_f.value <= myForm.day_i.value)" class="alert alert-danger"> The FINAL DATE camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide =" myForm.from.$pristine">' + '<span ng-show="myForm.from.$error.required " class="alert alert-danger"> The FROM camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide =" myForm.until.$pristine">' + '<span ng-show="myForm.until.$error.required || myForm.until.value < myForm.from.value" class="alert alert-danger"> The UNTIL camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide=" myForm.resource.$pristine ">' + '<span ng-show="myForm.resource.$error.required " class="alert alert-danger"> The RESOURCE camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide= " myForm.member.$pristine">' + '<span ng-show="myForm.member.$error.required " class="alert alert-danger"> The MEMBER camp is required. Or a invalid value was inserted <br/><br/> </span></div> ' + '<div ng-hide=" myForm.usercredit.$pristine">' + '<span ng-show="myForm.usercredit.$error.required " class="alert alert-danger"> The CREDIT camp is required. Or a invalid value was inserted <br/><br/> </span> </div> ' + '</div>' + '<div class="modal-footer">' + '<button ng-click="close(result)" id="b1" ng-model="b1" name="b1" class="btn btn-danger " >Close</button>' + //botão de fechar '<button ng-click="close2(okay) " id="b2" ng-model="b2" name="b2" class="btn btn-success" ng-disabled="myForm.usercredit.$pristine || myForm.day.$pristine || myForm.from.$pristine || myForm.until.$pristine || myForm.resource.$pristine || myForm.member.$pristine "> Book Now! </button>' + '</div>'; var modalInstance = $modal.open({ template: t, controller: 'TestDialogController', backdrop: "true", resolve: { event: function () { return $scope.newEventDate; }, stage: function () { return $scope.stage; } } }); modalInstance.okay.then( function () { alert(''); ; }); modalInstance.result.then( function (result) { //console.log('called $modalInstance.close()'); alert(result); $scope.addEvent(); }, function (result) { //console.log('called $modalInstance.dismiss()'); $scope.addEvent(); } ); }; app.controller('TestDialogController', function ($scope, $modalInstance) { $scope.close = function (result) { alert(result); $modalInstance.close(result); }}); 

 <div class="container pad-35"> <div class="row"> <!-- Space Header --> <venue-header title="{{ venue_title }}" nav="header"></venue-header> <!-- Dashboard --> <div class="col-md-12 pull-left" ng-cloak> <section id="directives-calendar" ng-controller="CalendarCtrl"> <div class="well"> <div class="row-fluid"> <div class="span8"> <tabset> <tab select="renderCalender('myCalendar1');"> <tab-heading> <i class="glyphicon glyphicon-bell"></i> Calendar One </tab-heading> <div class="btn-toolbar"> <center><p class="pull-right lead">Calendar One View Options</p></center> <div class="btn-group"> <button class="btn btn-success" ng-click="changeView('agendaDay', 'myCalendar1')">AgendaDay</button> <button class="btn btn-success" ng-click="changeView('agendaWeek', 'myCalendar1')">AgendaWeek</button> <button class="btn btn-success" ng-click="changeView('month', 'myCalendar1')">Month</button> <!--select para definir o resource a ser usado no controler js--> </div> <p class="textalign1"> <center> <select id="select-lucas" class="dropdown-toggle btn btn-success " ng-model="model.id" convert-to-number> <option value="" selected="selected" onclick="">small meeting room</option> <option value="1" selected="selected" onclick="">medium meeting room</option> <option value="2" selected="selected" onclick="">Big meeting room</option> <option value="3" selected="selected" onclick="">Giant meeting room</option> </select> </center> </p> </div> <div class="calendar ng-model="eventSources" calendar="myCalendar1" ui-calendar="uiConfig.calendar"></div> </tab> </tabset> </div> </div> </div> </section> </div> </div> </div> 

結果是彈出：

Answer 1

您的表單是在模態中定義的，模態具有自己的控制器和自己的范圍。

所以當你這樣做

 ng-model="until"

在您的輸入中，這將綁定變量“直到”作用域模態的控制器。

因此，如果要構建對象，必須在模態控制器中執行以下操作：

var book = {};
book.buntil = $scope.until;

每個字段都相同。 之后，如果您想將這些書顯示到主視圖，則可以使用發出的事件並在$ rootscope上偵聽。

我不知道您使用哪個模態庫，所以我不能說范圍是否是另一個的子級。