কিভাবে কৌণিক.জেজে ইতিহাস.ব্যাক () প্রয়োগ করতে হয়

Question

আমার কাছে নির্দেশ রয়েছে যা ব্যাক বোতামের সাথে সাইট শিরোনাম এবং আমি আগের পৃষ্ঠায় ফিরে যেতে ক্লিক করতে চাই। আমি এটি কৌণিক উপায়ে কীভাবে করব?

আমি চেষ্টা করেছি:

<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'
        }
    };
});

কিন্তু কিছুই হয় না। আমি $ অবস্থান সম্পর্কে কৌণিক.জেএসপি এপিআইতে দেখেছি কিন্তু পিছনের বোতাম বা সম্পর্কে কিছুই পাইনি history.back()।

Comments

আপনি উল্লেখ করেছেন যে এটি আপনার পক্ষে কাজ করেছে। এটি আপনাকে আপনার অ্যাপ্লিকেশনের বিভিন্ন পৃষ্ঠায় নিয়ে যায় বা ব্রাউজারটি কেবল ফিরে আসে? দেখে মনে হচ্ছে এটি ব্রাউজারটি আমার কাছে ফিরে আসে।

— Chookoos

আপনি যদি এইচটিএমএল 5 মোড ব্যবহার করতে অ্যাঙ্গুলারজেএস সেট করে থাকেন তবে ব্রাউজারের ইতিহাসে ইতিমধ্যে যে কোনও পৃষ্ঠাতে যাওয়া ক্যাশেড সংস্করণ ব্যবহার করবে এবং এটিকে পুনরায় লোড করবে না। আমি যে প্রকল্পে কাজ করছি তাতে পুরানো এবং নতুন কোডের মিশ্রণ ব্যবহার করা হয়েছে এবং অ্যাঙ্গুলারজেএস দিয়ে ডেটা সংরক্ষণ করার পরে পূর্ববর্তী পৃষ্ঠাটি পরিবর্তিত হবে। এটি AngularJS ব্যবহার করার জন্য প্রথম পৃষ্ঠার আপগ্রেড করার বিকল্প নয় তাই আমাকে প্রথমটিতে ফিরে যেতে পুনরায় ডাইরেক্ট করতে তৃতীয়, অ-কৌণিক জেএস পৃষ্ঠাটি লোড করতে হয়েছিল। একটি দুর্দান্ত সমাধান নয়, তবে এটি কার্যকর।

— সিজে ডেনিস

Answer 1

আপনার নির্দেশিকায় আপনাকে একটি লিঙ্ক ফাংশন ব্যবহার করতে হবে:

link: function(scope, element, attrs) {
     element.on('click', function() {
         $window.history.back();
     });
 }

JsFizz দেখুন ।

Comments

তবে আমার হেডারে আমার 2 টি বাটন রয়েছে একটি বাড়ির জন্য এবং একটির জন্য যদি আমি আপনার কোডটি বুঝতে পারি যদি লিঙ্ক ফাংশনে থাকা উপাদানটি হ'ল ইতিহাসে ক্লিক করা উপাদানটি। তবে হোম বোতামের জন্যও প্রয়োগ হবে? )

— baba-dev

আমি উদাহরণটি কিছুটা পরিবর্তন করেছি। এখন দুটি বোতাম আছে (পিছনে এবং সামনে) এটি এখন jQuery ব্যবহার করে, যার অর্থ স্কোপ $ প্রয়োগ () ক্লিকের জন্য প্রয়োজন।

— 14:44

এই কোডটি অকেস্টেবল, আপনার উইন্ডোটির পরিবর্তে '$ উইন্ডো' অবজেক্টটি ব্যবহার করা উচিত।

— সালিস

এটি কি আই 8 এর সাথে কাজ করে? আমি বিশ্বাস করি না এর ইতিহাস আছে

— নীল

@ নীল, কৌনিকটি গর্বের সাথে আইই 8 সমর্থন করে না। সুতরাং, না।

— র‌্যাপ

Answer 2

কৌণিক রুটগুলি ব্রাউজারের অবস্থান দেখায়, তাই window.history.back()কোনও কিছু ক্লিক করে কেবল কাজ করা কাজ করে।

এইচটিএমএল:

<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())।

Comments

আমি "বৈশ্বিক ফাংশন" এ কিছু রাখার বিরুদ্ধে সুপারিশ করব। বিশ্বব্যাপী রাজ্যে ঘটতে পারে এমন অনেক কিছুই রয়েছে । এই ক্ষেত্রে এটি বেশিরভাগ ক্ষেত্রেই অস্থিরতা। তৃতীয় পক্ষের কোড (বা অন্য কোনও বিকাশকারী, আপনি যদি একটি বড় দলের হয়ে থাকেন) বলুন, কোনও নির্দেশিকা বা কোনও পরিষেবা সহজেই children সুযোগটি $ সংশোধন করতে পারে এটির শিশুদের জন্য। যা ডিবাগ করা কঠিন হতে পারে। প্রতিটি উপাদানগুলির মধ্যে একটি পরিষেবা ইনজেকশনের জন্য এটি প্রয়োজনীয়ভাবে অনুশীলন এবং যেখানে প্রয়োজন সেখানে কার্যকারিতাটি প্রকাশ করে। উদাহরণটি কেবল "অ্যাপ্লিকেশনে গ্লোবাল", তবে ঝুঁকি রয়েছে

— বেন লেশ

উত্স: আমার কাছে "গ্লোবাল" অ্যাপ্লিকেশনটিতে আটকে থাকা জিনিসগুলি ছিল $ স্কোপ আমাকে গণনা করার জন্য অনেকবার কামড়ায় ফেলেছিল এবং আমি সেই কৌশলটি পরিষেবাগুলির পক্ষে ব্যবহার বন্ধ করে দিয়েছি। যা এখনও ট্রাম্পড করা যেতে পারে তবে এটি খুঁজে বের করা সহজ।

— বেন লেশ

Answer 3

নিয়ামকদের অনর্থক $ উইন্ডো থেকে মুক্ত রাখতে আদর্শভাবে একটি সাধারণ নির্দেশিকা ব্যবহার করুন

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>

Comments

আপনি $ উইন্ডো নির্ভরতা দেখিয়ে খুশি হয়েছেন - এটি গুরুত্বপূর্ণ।

— ক্রিস স্মিথ

Answer 4

আরেকটি চমৎকার এবং পুনর্ব্যবহারযোগ্য সমাধান মত একটি ডিরেক্টিভের তৈরি করা এই :

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>

Comments

আপনি একবার ক্লোজিং কোঁকড়াটিকে পুনরায় অর্ডার করলেন এবং একে অপরের সাথে মেলে নির্দেশিকা এবং উপাদান অ্যাটরটির নাম পরিবর্তন করুন work

— পুনর্বার

Answer 5

যদি এটি কার্যকর হয় ... আমি "10 $ ডাইজেস্ট () পুনরাবৃত্তিতে পৌঁছেছিলাম Ab .h window.history.back () ব্যবহার করার সময় ত্রুটি; আইই 9 এর সাথে (অবশ্যই অন্যান্য ব্রাউজারগুলিতে কাজ করে)।

আমি এটি ব্যবহার করে কাজ করতে পেরেছি:

setTimeout(function() {
  $window.history.back();
},100);

Comments

অন্যান্য উত্তরগুলি সরল ব্যবহার করে window। আপনি $windowকৌনিক পরিষেবাটি ব্যবহার করছেন বলে মনে হচ্ছে । এটাই কি মূল কারণ?

— সুপারজোজ

আইই 9 এর অধীনে আমি একই ত্রুটি পেয়েছি এবং এটি সমস্যার সমাধান করেছে। Github.com/angular/angular.js/issues/1417 দেখুন $ উইন্ডোটি ব্যবহার করার বিষয়ে তিনি ঠিক বলেছেন, অন্য সমস্ত উত্তর এই পয়েন্টটিতে "ভুল", ডকস.আঙ্গুলারজ.স.আর.সি.পি.

— উইন্ডো

100ms কেন কোন ধারণা? এটি বেশ বিলম্ব, এটি কি কম দিয়ে কাজ করে?

— কেভিন

@ কেভিন 100 মিমি কেবলমাত্র একটি সময়কাল যা আমি ভেবেছিলাম যুক্তিসঙ্গত এবং ইমো লক্ষণীয় নয়। আসলে একটি ছোট বিলম্ব কাজ করতে পারে।

— রব বাইগ্রাভ

আমার অ্যাপ্লিকেশনটিতে কৌনিক ডিফল্ট নেভিগেশন ব্যবহার করার সময় আমি সর্বশেষ ক্রোমে একই ধরণের সমস্যা পেয়েছি এবং বিলম্বটিও কোনও সাহায্য করবে না। কেবলমাত্র কৌনিকের নেভিগেশন পরিচালনা অক্ষম করা সহায়তা করেছে।

— ডোমি

Answer 6

অথবা আপনি সহজভাবে ব্যবহার করতে পারেন জাভাস্ক্রিপ্ট কোড:

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

ভালো লেগেছে:

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

Comments

এটি এতগুলি স্তরে ভুল দেখাচ্ছে, সিএফ। প্রায় 10 বছর আগে এই ব্লগ পোস্ট

— রোকো

Answer 7

একটি বাক্য গঠন ত্রুটি ছিল। এটি চেষ্টা করুন এবং এটি কাজ করা উচিত:

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

Answer 8

কৌণিক 4:

/* typescript */
import { Location } from '@angular/common';
// ...

@Component({
  // ...
})
export class MyComponent {

  constructor(private location: Location) { } 

  goBack() {
    this.location.back(); // go back to previous location
  }
}

Answer 9

আমার জন্য, আমার সমস্যাটি আমার ফিরে নেভিগেট এবং তারপরে অন্য একটি রাজ্যে স্থানান্তরিত করা দরকার ছিল। সুতরাং ব্যবহার করা কার্যকর $window.history.back()হয়নি কারণ কোনও কারণে ইতিহাসের আগেই রূপান্তর ঘটেছিল back

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

এটি আমার সমস্যাটি স্থির করেছে।

Answer 10

AngularJS2 এ আমি একটি নতুন উপায় খুঁজে পেয়েছি, সম্ভবত কেবল একই জিনিস তবে এই নতুন সংস্করণে:

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

(...)

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

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

আমার ফাংশনটির পরে, আমি দেখতে পাচ্ছি যে আমার অ্যাপ্লিকেশনটি কৌনিক 2 / রাউটার থেকে পূর্ববর্তী পৃষ্ঠায় ইউজিন লোকেশনে চলেছে।

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

Comments

এটি কাজ করে, আপনি @ কৌনিক / সাধারণ থেকে এটি আমদানি করতে হবে, @ কৌনিক / রাউটার নয়।

— প্লেক্সাস