Нг-переключатель не передает аргумент

Question

Нг-переключатель не передает аргумент

Я использую ng-switch для переключения между двумя функциями в моем веб-приложении: загрузка и выгрузка (управляется двумя кнопками). Когда пользователь хочет скачать, я использую текстовое поле и кнопку отправки, чтобы передать поисковый запрос в запрос $http POST в моем js-файле.

Это HTML-код:

<button class="btn" name="search" ng-click="name = 'download'">Search & Download</button>
<button class="btn" name="upload" ng-click="name = 'upload'">Upload & Index</button>

<div ng-switch="name">
    <div ng-switch-when="download">
        <input type="text" ng-model="docsterm"  my-enter="postData()" placeholder="Search">
        <br><br>
        <uib-accordion close-others="oneAtATime">
            <div uib-accordion-group class="panel-default" heading={{result._source.filename}} ng-repeat="result in results.data.hits.hits">
                <span ng-bind-html="highlight(result._source.attachment.content, docsterm)"></span>
                <br><br>
                <button class="btn">Preview</button>
                <!-- Create the download button -->
                <a href=""><button class="btn" ng-click="download(result._source.data, result._source.filename, result._source.attachment.content_type)"><i class="fa fa-download"></i></a>
                <!-- <textarea id="textbox">Type something here</textarea> <button id="create">Create file</button> <a download="info.txt" id="downloadlink" style="display: none">Download</a> -->

                <br>
                <!--
            <ul uib-pagination boundary-links="true" total-items="results['hits']['total']"  ng-model="currentPage" items-per-page="5" class="pagination-sm" previous-text="&lsaquo;" next-text="&rsaquo;" first-text="&laquo;" last-text="&raquo;"></ul>
            -->
            </div>
        </uib-accordion>
    </div>

    <div ng-switch-when="upload">
        <!-- Multiple files -->
        <button class="btn" ngf-select ng-model="files" ngf-multiple="true">Select Files</button>
        <button class="btn" ng-click="submit()">Submit</button>
    </div>
</div>

Это мой код JS:

docsApp.controller('docsController', function ($scope, $http, $sce) {

$scope.docsterm = "";
$scope.results = "";
$scope.currentPage = 1;
$scope.content = "";
$scope.content_type = "";

$scope.postData = function(docsterm) {
    $http({
        url: 'http://192.168.100.30:9200/my_index4/_search?q=' + $scope.docsterm,
        method: "POST"
    })
    .then(function(response) {
        $scope.results = response;
        // $scope.content_type = response.data.
        console.log($scope.results);
        /*console.log($scope.content);
        console.log($scope.content_type);*/
    },
    function(response) { // optional
        $scope.results = "No results found."
    });
}

Тем не мение, docsterm не передается в файл JS. В консоли я вижу, что отправляется запрос $ http:

http://192.168.100.30:9200/my_index4/_search?q=

Так должно быть:

http://192.168.100.30:9200/my_index4/_search?q=whateverDocstermIs

Следует отметить, что точный код функции загрузки работает нормально, когда он не вложен в ng-switch, что позволяет мне полагать, что ng-switch вызывает некоторые проблемы.

Есть идеи? Спасибо!

1

html angularjs ng-switch

Источник

user5555924 20 июн '18 в 13:02

1 ответ

Решение

Другие вопросы по тегам html angularjs ng-switch

user8495123 20 июн '18 в 13:09 2018-06-20 13:09 · Accepted Answer · 2018-06-20 13:09

Я думаю, это потому что ng-switch ведет себя как ng-if - это создает свою собственную сферу.

Чтобы достичь области действия контроллера, вам необходимо иметь $parent. перед моделью

<input type="text" ng-model="$parent.docsterm"  my-enter="postData()" placeholder="Search">

Вот пример этого (с и без $parent)

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.name = "download"
  $scope.foo = function() {
    console.log("Works:", $scope.docsterm);
    console.log("Doesn't work:", $scope.docsterm2);
  }
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
  <div ng-app="myApp" ng-controller="myCtrl">
    <div ng-switch="name">
      <div ng-switch-when="download">
        <input type="text" ng-model="$parent.docsterm">
        
        <input type="text" ng-model="docsterm2">
        
        <button ng-click="foo()">Click</button>
      </div>
      <div ng-switch-when="upload">
        ...
      </div>
    </div>
  </div>
</body>
</html>