как получить текущий вид содержимого только в контроллере angularjs?

0

Я имею дело с md-tabs-wrapper, он дает частичный вид каждой категории и одной кнопки сохранения, как показано далее Изображение 174551

Существующий код для него

    <md-dialog aria-label="Profile edit" class="profile-edit full-height">
      <form>
      <md-toolbar>
        <div class="md-toolbar-tools">
          <h2>Edit Profile</h2>
          <span flex></span>
          <md-button class="md-icon-button" ng-click="hide()">
            <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
          </md-button>
        </div>
      </md-toolbar>


      <md-dialog-content >
        <md-tabs class=" margin-bottom-40" md-dynamic-height md-border-bottom>
            <md-tab label="Profile"> 
              <div layout layout-sm="column">
                <md-input-container flex="30">
                    <label>First Name</label>
                    <input type="text" ng-model="user.firstName">
                </md-input-container>
                <md-input-container flex>
                    <label>Last Name</label>
                    <input type="text" ng-model="user.lastName">
                </md-input-container>
              </div>
              <div layout layout-sm="column">
                <md-input-container flex="30">
                    <label>Other Name</label>
                    <input type="text" ng-model="user.otherName">
                </md-input-container>
                <md-select flex class="md-select-form" ng-model="user.gender" placeholder="Gender" ch-boolean>
                      <md-option ng-value="gender" ng-repeat="gender in ['Male', 'Female']">{{gender}}</md-option>
                </md-select>
                <md-input-container flex>
                      <label>Date of Birth</label>
                      <input type="date" ng-model="user.dateOfBirth">
                  </md-input-container>
              </div>
              <md-input-container>
                <label>Profile Picture</label>
                <input type="file" name="file" file-model = "user.myFile">
              </md-input-container> 

              <md-input-container flex>
                <label>Summary(max 200 characters)</label>
                <textarea ng-model="user.description" md-maxlength="200"></textarea>
              </md-input-container>      
            </md-tab>

            <md-tab label="Experience" ng-init="">
              <h2>Employment</h2>
              <div ng-repeat="experience in user.experiences"> 
                <md-input-container>
                    <label>Job title</label>
                    <input type="text" ng-model="experience.job_title">
                </md-input-container>
                <div layout layout-sm="column">
                  <md-input-container flex="66">
                      <label>Employeer Name </label>
                      <input type="text" ng-model="experience.company_name">
                  </md-input-container>
                  <md-input-container flex="33">
                      <label>Location</label>
                      <input type="text" ng-model="experience.location_name">
                  </md-input-container>
                </div>
                <div layout layout-sm="column">
                  <md-input-container flex="40">
                      <label>Start Date</label>
                      <input type="date" ng-model="experience.date_start" date-ob>
                  </md-input-container>
                  <md-input-container flex="40" ng-if="experience.current_work==0">
                      <label>End Date</label>
                      <input type="date" ng-model="experience.date_end" date-ob>
                  </md-input-container>
                  <md-checkbox flex ng-model="experience.current_work" ng-true-value='1' ng-false-value='0' aria-label="Current" style="margin: 5px;">
                    Current
                  </md-checkbox>
                </div>              
                  <md-input-container flex>
                    <label>Job Description </label>
                    <textarea ng-model="experience.job_des" ></textarea>
                  </md-input-container> 

              </div>
              <md-button class="md-primary md-raised" ng-click="removeTab( tab )">Add Position</md-button>     
            </md-tab>

              <h2 class="md-subhead">Projects</h2>
              <div> 
                <md-input-container>
                    <label>Project Title</label>
                    <input type="text" ng-model="user.jobtitle">
                </md-input-container>
                <div layout layout-sm="column">
                  <md-input-container flex="66">
                      <label>Employeer Name </label>
                      <input type="text" ng-model="user.employeer">
                  </md-input-container>
                  <md-input-container flex>
                      <label>Start Date</label>
                      <input type="date" ng-model="user.startDate">
                  </md-input-container>
                  <md-input-container flex>
                      <label>End Date</label>
                      <input type="date" ng-model="user.endDate">
                  </md-input-container>
                </div>
                  <md-input-container flex>
                    <label>Project Details </label>
                    <textarea ng-model="user.jobDescription" ></textarea>
                  </md-input-container> 
              </div>
              <md-button class="md-primary md-raised" ng-click="removeTab( tab )">Add Projects</md-button>     
            </md-tab>
              <div layout layout-sm="column">
                <md-input-container flex>
                    <label>Primary Number</label>
                    <input type="text" ng-model="user.primaryNumber">
                </md-input-container>
                <md-input-container flex>
                    <label>Secondary Number</label>
                    <input type="text" ng-model="user.secondaryNumber">
                </md-input-container>
              </div>

              <div layout layout-sm="column">
                <md-input-container flex>
                    <label>Primary Email</label>
                    <input type="text" ng-model="user.primaryNumber">
                </md-input-container>
                <md-input-container flex>
                    <label>Secondary Email</label>
                    <input type="text" ng-model="user.secondaryNumber">
                </md-input-container>
              </div>

              <h2 class="md-subhead">Social Media Links</h2>
              <md-input-container md-no-float>
                <md-icon md-font-icon="icon-facebook-squre" style="display:inline-block;"></md-icon>
                <input ng-model="user.address" type="text" placeholder="Url" >
              </md-input-container>
              <md-input-container md-no-float>
                <md-icon md-font-icon="icon-location-on" style="display:inline-block;"></md-icon>
                <input ng-model="user.address" type="text" placeholder="Url" >
              </md-input-container>
              <md-input-container md-no-float>
                <md-icon md-font-icon="icon-location-on" style="display:inline-block;"></md-icon>
                <input ng-model="user.address" type="text" placeholder="Url" >
              </md-input-container>
              <md-input-container md-no-float>
                <md-icon md-font-icon="icon-location-on" style="display:inline-block;"></md-icon>
                <input ng-model="user.address" type="text" placeholder="Url" >
              </md-input-container>



            </md-tab>
        </md-tabs>
      </md-dialog-content>

      <div class="md-actions" layout="row">
        <span flex></span>
        <md-button ng-click="hide()" class="md-primary">
         Cancel
        </md-button>
        <md-button ng-click="answer(this)" class="md-primary">
          Save
        </md-button>
      </div>
      </form>
      </div>
    </md-dialog>

В моем контроллере я закодировал, чтобы сохранить каждое содержимое вкладки, поскольку оно

$scope.answer = function(answer) {
    console.log(answer);
    Profile.editProfilePro($scope.user);
    Profile.editProfileExp($scope.user.experiences[0]);
    $mdDialog.hide(answer);
 };

Я хочу выполнить Profile.editProfileExp($ scope.user), только если текущее представление в опыте. Проблема в том, как сохранить текущее содержимое вкладки просмотра только в ответе контроллера ()? Расскажи мне свои предложения. Благодарю.

  • 0
    использовать Profile.editProfileExp($scope.experience);
  • 0
    мне нужно выполнить только текущий editProfile. в этом случае либо Profile.editProfileExp (), либо Profile.editProfilePro ()
Теги:
angularjs-scope
angularjs-controller
angularjs-material
angularjs-templates

1 ответ

0

вы можете иметь переменную области видимости как tabsdata для активной вкладки, чтобы вы могли идентифицировать выбранную вкладку и добавить атрибут "active =" tabsdata.ExperienceTab "к тегу html" md-tab ", который предоставит вам активный статус Tab и на основе выбранной вами вкладки выполните свой код.

  • 0
    Как прочитать это активное значение атрибута в контроллере?
  • 0
    "tabsdata" будет вашей переменной области видимости, поэтому всякий раз, когда вы нажимаете на tab из-за двухсторонней привязки, она автоматически обновляется, нет необходимости читать активный атрибут, и если вы хотите прочитать атрибут "active", вы можете использовать jquery yourHTMLElement.attr ("active «). это даст вам ценность активного

Ещё вопросы

Сообщество Overcoder
Наверх
Меню