javascript - passing parameters to state is causing element to not show -
in angularjs app, have form in user needs enter application number, , if successful, display content below displays appropriate data. data can access through scope
if pass parameter current state
. using ui-router
routing.
i have read threads such reloading current state - refresh data has advised me can pass data current state , not refresh page keeps refreshing , content doesn't show. not sure whether using ng-show
and/or ng-if
correctly. function pass data follows:
vm.findpatent = function(patentno) { searchpatentservice.findpatent(patentno) .then( function(data) { $state.go('.', { patent: data }, {reload: false, notify: false, location: false}) }) }, function(errresponse) { console.error('error while finding patent'); } ); }
and parameters within state
:
.state('search-patent', { url: '/search-patent', component: 'searchpatent', params: { navigation: 'patentnav', patent: null } })
and view form displays content below on form submit:
<form ng-submit="$ctrl.findpatent(searchpatent)" name="searchpatentform"> <fieldset> <div class="form-group row"> <labelfor="searchpatent">ep no.</label> <div> <input type="text" name="searchpatent" ng-model="searchpatent" class="form-control" placeholder="search" required> </div> <div> <button type="submit">submit</button> </div> </div> </fieldset> </form> <div class="row" ng-show="searchpatentform.$submitted"> <div class="col-md-12"> //another form , content displayed on submit </div> </div>
question
how pass data current state
without refreshing page? also, there better solution using ng-show
? thanks
since want remain on page after have submitted .
$scope.result= null; vm.findpatent = function(patentno) { searchpatentservice.findpatent(patentno) .then( function(data) { $scope.result=data; }) }, function(errresponse) { console.error('error while finding patent'); } ); }
in view should use ng-if
if want div recreated else use ng-show
see details here
<div class="row" ng-if="result"> <div class="col-md-12"> {{result}} </div> </div>
for detailed example see here
Comments
Post a Comment