Wie blende ich das Formular mit ng-click?

Question

Ich habe ein Suchformular. Wenn ich auf die Schaltfläche klicke, werden einige Produktdetails angezeigt. Sobald ich die Details habe, möchte ich dieses Formular ausblenden.

product.html

<form name="search_form"> 
    <div class="search" flex layout="row" layout-align="start center"> 
    <md-icon md-font-icon="icon-magnify" class="icon search-icon"></md-icon> 
    <input class="search-input" ng-model="vm.form.search" type="text" placeholder="Place your URL here.." flex> 
    </div> 
    <md-button class="md-raised md-accent" aria-label="LOG IN" ng-click="vm.submitPost(vm.form);"> 
    Get Details 
    </md-button> 
</form> 

product.controller.js

(function() { 
    'use strict'; 

    angular 
     .module('app.product') 
     .controller('ProductController', ProductController); 

    /** @ngInject */ 
    ProductController.$inject = ['$http', '$location']; 
    function ProductController($http, $location, Auth, $rootScope) { 
     var vm = this; 

     vm.submitPost = function(userData) { 
      //console.log(userData); 
      $http({ 
       url: 'http://localhost:7200/api/product-search', 
       method: 'POST', 
       data: userData 
      }).then(function(res) { 
       console.log('success'); 
       vm.Product_Name=res.data.Product_Name; 
       vm.Brand=res.data.Brand; 
       vm.Color=res.data.Color; 
       vm.Price=res.data.Price; 
       vm.Rating=res.data.Rating; 
       vm.Image=res.data.Image; 
      }, function(error) { 
       console.log(error); 
       alert('Please enter url'); 
      }); 
     }; 
    } 
})(); 

sieht Meine Form wie folgt aus:

In diesem Bild habe ich dieses Formular markiert. Wenn ich auf die get details Schaltfläche klicke, möchte ich Details des Produkts erhalten und gleichzeitig dieses Formular ausblenden.

Answer 1

eine Variable verwenden mit ngHide:

Nach dem Versprechen in der submitPost Funktion, eine Variable auf wahr:

vm.hideForm = true; 

Verwendung ngHide mit der Form, in der Auszeichnungs:

<form ng-hide="vm.hideForm === true">