Как я могу связать или скопировать одно входное значение в другой вход, используя angularjs? - PullRequest
Новая
       75

Как я могу связать или скопировать одно входное значение в другой вход, используя angularjs?

0 голосов
/ 10 мая 2018
  • Привет всем, я использую стек MEAN на своем веб-портале с AngularJS в качестве внешнего интерфейса,

  • На моем портале я хочу загрузить изображение профиля пользователя, поэтому я использовал uplodcare платформу для загрузки изображений на моем портале.

  • Мой Плункер

  • после выбора изображения, которое мы получаем в качестве URL-адреса этого изображения в upload input, нам нужно привязать или скопировать эти значения URL-адреса во входные данные ниже для сохранения в бэкэнде. поэтому мы попытались получить решение типа ng-bind="userimg=img" value="{{img}}", которое не работает. пожалуйста, проверьте и обновите нам спасибо.

Мой код: - 

<div>
    <label >Upload Img</label>
  <input ng-model="img" role="uploadcare-uploader" name="content" data-public-key="240426036fd9daf2d723" data-images-only />

</div>

<div>
    <label for="quantity">Fetch above input value in this input</label>
    <input type="text" ng-model="userimg" ng-bind="userimg=img" value="{{img}}">

</div>

Ответы [ 2 ]

0 голосов
/ 10 мая 2018

У меня есть одно временное решение для вашего вопроса, так как вы используете angularJS 1 версию 

   <div>
      <label >Upload Img</label>
      <input id="fileId" role="uploadcare-uploader" name="content" data-public- 
       key="240426036fd9daf2d723" data-images-only />  
   </div>
   <div>
     <label for="quantity">Fetch above input value in this input</label>
     <input type="text" ng-model="userimg">         
     <input type="submit" value="Set">
   </div>

и в контроллере 

$scope.userimg = null;
$(':submit').on('click', function() {
  var input = $('#fileId');

  $scope.userimg = input[0].value;
  $scope.$apply();
})

При нажатии кнопки настройки вы получите значение,Поскольку вы используете эту библиотеку https://ucarecdn.com/libs/widget/3.3.0/uploadcare.full.min.js, я могу дать это временное решение

, если вы используете angularJs 1 любую версию, тогда используйте библиотеку angular-uploadcare

https://github.com/uploadcare/angular-uploadcare

и если вы используете версию 2 или выше, используйте ngx-uploadcare-widget https://github.com/uploadcare/ngx-uploadcare-widget

0 голосов
/ 10 мая 2018

Вам просто нужно отобразить переменную img в текстовом поле для <label for="quantity">.

В файле ts объявите переменную img

 img;

В файле HTML 

<div>
     <label >Upload Img</label>
      <input [(ngModel)]="img" role="uploadcare-uploader" name="content" data-public-key="240426036fd9daf2d723" data-images-only />

    </div>

    <div>
        <label for="quantity">Fetch above input value in this input</label>
        <input type="text" [(ngModel)]="img" value="{{img}}">

    </div>
...