javascript - Angular.js में history.back() को कैसे कार्यान्वित करें




angularjs (7)

मेरे पास निर्देश है जो बैक बटन के साथ साइट हेडर है और मैं पिछले पृष्ठ पर वापस जाने के लिए क्लिक करना चाहता हूं। मैं इसे कोणीय तरीके से कैसे करूं?

मैं प्रयास कर चुका हूं: 

<header class="title">
<a class="back" ng-class="icons"><img src="../media/icons/right_circular.png" ng-click="history.back()" /></a>
<h1>{{title}}</h1>
<a href="/home" class="home" ng-class="icons"><img src="../media/icons/53-house.png" /></a>   
</header>

और यह निर्देश जेएस है: 

myApp.directive('siteHeader', function () {
    return {
        restrict: 'E',
        templateUrl: 'partials/siteHeader.html',
        scope: {
            title: '@title',
            icons: '@icons'
        }
    };
});

लेकिन कुछ भी नहीं होता है। मैंने angular.js एपीआई में लगभग $location लेकिन बैक बटन या history.back() बारे में कुछ भी नहीं मिला।

AngularJS2 में मुझे एक नया तरीका मिला, शायद यह वही बात है लेकिन इस नए संस्करण में: 

import {Router, RouteConfig, ROUTER_DIRECTIVES, Location} from 'angular2/router'; 

(...)

constructor(private _router: Router, private _location: Location) {}

onSubmit() {
    (...)
    self._location.back();
}

मेरे कार्य के बाद, मैं देख सकता हूं कि मेरा एप्लिकेशन पिछले पृष्ठ usgin स्थान पर कोणीय 2 / राउटर से जा रहा है।

https://angular.io/docs/ts/latest/api/common/index/Location-class.html

आदर्श रूप से अनावश्यक $ विंडो से नियंत्रकों को मुक्त रखने के लिए एक सरल निर्देश का उपयोग करें 

app.directive('back', ['$window', function($window) {
        return {
            restrict: 'A',
            link: function (scope, elem, attrs) {
                elem.bind('click', function () {
                    $window.history.back();
                });
            }
        };
    }]);

इस तरह प्रयोग करें: 

<button back>Back</button>

एक और अच्छा और पुन: प्रयोज्य समाधान this तरह का निर्देश बनाना है: 

app.directive( 'backButton', function() {
    return {
        restrict: 'A',
        link: function( scope, element, attrs ) {
            element.on( 'click', function () {
                history.back();
                scope.$apply();
            } );
        }
    };
} );

तो बस इसे इस तरह इस्तेमाल करें: 

<a href back-button>back</a>

एक वाक्यविन्यास त्रुटि थी। इसे आज़माएं और इसे काम करना चाहिए: 

directives.directive('backButton', function(){
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            element.bind('click', function () {
                history.back();
                scope.$apply();
            });
        }
    }
});

कोणीय मार्ग ब्राउज़र के स्थान को देखते हैं, इसलिए बस कुछ क्लिक करने पर window.history.back() का उपयोग करना काम करेगा।

HTML: 

<div class="nav-header" ng-click="doTheBack()">Reverse!</div>

जे एस: 

$scope.doTheBack = function() {
  window.history.back();
};

मैं आमतौर पर अपने ऐप नियंत्रक पर '$ बैक' नामक एक वैश्विक फ़ंक्शन बनाता हूं, जिसे मैं आमतौर पर बॉडी टैग पर डालता हूं। 

angular.module('myApp').controller('AppCtrl', ['$scope', function($scope) {
  $scope.$back = function() { 
    window.history.back();
  };
}]);

फिर मेरे ऐप में कहीं भी मैं केवल <a ng-click="$back()">Back</a> कर सकता हूं

(यदि आप इसे अधिक टेस्टेबल होना चाहते हैं, तो अपने कंट्रोलर में $ विंडो सेवा इंजेक्ट करें और $window.history.back() ) का उपयोग करें।

मेरे लिए, मेरी समस्या मुझे वापस नेविगेट करने और फिर किसी अन्य राज्य में संक्रमण करने की आवश्यकता थी। तो $window.history.back() का उपयोग नहीं किया गया क्योंकि किसी कारण से संक्रमण इतिहास से पहले हुआ था। ()) इसलिए मुझे टाइमआउट फ़ंक्शन में अपना संक्रमण लपेटना पड़ा। 

$window.history.back();
setTimeout(function() {
  $state.transitionTo("tab.jobs"); }, 100);

यह मेरी समस्या तय है।

या आप javascript कोड का उपयोग कर सकते हैं: 

onClick="javascript:history.go(-1);"

पसंद: 

<a class="back" ng-class="icons">
   <img src="../media/icons/right_circular.png" onClick="javascript:history.go(-1);" />
</a>



javascript   angularjs  


angularjs