Ember.js: ์ค‘๋‹จ ํ›„ eager URL ์ •๋ฆฌ

์— ๋งŒ๋“  2014๋…„ 07์›” 22์ผ  ยท  28์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: emberjs/ember.js

Eager URL ์—…๋ฐ์ดํŠธ ๋Š” ๋ชจ๋“  ๊ฒƒ์ด ๋™์ผํ•œ runloop์—์„œ ์ค‘๋‹จ๋˜๊ฑฐ๋‚˜ ์ „ํ™˜ ๋  ๋•Œ ์œ ์šฉํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ์ค‘๋‹จ ๋ฐ ์ „ํ™˜์€ ํ›„์† ์‹คํ–‰ ๋ฃจํ”„์—์„œ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ์ด ๊ฒฝ์šฐ ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์„ ์ค‘๋‹จ ๋œ ์ƒํƒœ๋กœ ๋‘ก๋‹ˆ๋‹ค.

์ค‘๋‹จ์˜ ๊ฒฝ์šฐ ์‹ค์ œ ํ˜„์žฌ ์ƒํƒœ๋ฅผ ๋ฐ˜์˜ํ•˜์ง€ ์•Š๋Š” URL๋กœ ๋๋‚ฉ๋‹ˆ๋‹ค. ๋‹ค์Œ์— ์‚ฌ์šฉ์ž๊ฐ€ ๋’ค๋กœ ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ์•„๋ฌด ์ผ๋„ ์ผ์–ด๋‚˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

๋ฆฌ๋””๋ ‰์…˜์˜ ๊ฒฝ์šฐ ์‚ฌ์šฉ์ž ๊ธฐ๋ก์— ์ค‘๊ฐ„ ์ƒํƒœ๋ฅผ ๋‚จ๊ฒจ ๋’ค๋กœ ๋ฒ„ํŠผ์„ ํ•ด์ œํ•˜๋ฉด ์ข…์ข… ๋‹ค์‹œ ๋ฆฌ๋””๋ ‰์…˜๋ฉ๋‹ˆ๋‹ค.

๋‚˜๋Š” ์ด๊ฒƒ์„ @machty ์™€ ๋…ผ์˜ํ–ˆ๊ณ  ์šฐ๋ฆฌ๋Š” ์ด๊ฒƒ์— ๋Œ€ํ•ด ์ž‘์—…ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์„ ๊ฒƒ์ด๋ผ๊ณ  ๋™์˜ํ–ˆ์Šต๋‹ˆ๋‹ค. ๋Œ€๋ถ€๋ถ„์˜ ๊ฒฝ์šฐ ๋ผ์šฐํ„ฐ๋Š” eager URL ํ‘ธ์‹œ๋ฅผ ์ถ”์ ํ•˜๊ณ  ์ค‘๋‹จ์ด ๋ฐœ์ƒํ•  ๋•Œ history.back() ๋˜๋Š” ์ด์™€ ์œ ์‚ฌํ•œ ๋ฐฉ์‹์œผ๋กœ์ด๋ฅผ ํ•ด์ œ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Bug Inactive Needs Submitter Response

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

์ด๊ฒƒ์€ https://github.com/tildeio/router.js/pull/197(2.10.0-beta.3+ ์—์„œ)์— ์˜ํ•ด ์ˆ˜์ •๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

v2.10.0-beta.3์— ๋Œ€ํ•œ ๋ฐ๋ชจ : http://emberjs.jsbin.com/yeqisuh/1

๋ชจ๋“  28 ๋Œ“๊ธ€

์ด ๋ฌธ์ œ์— ๋™์˜ํ•ฉ๋‹ˆ๋‹ค. ๊ฒฝ๋กœ์˜ willTransition ํ›„ํฌ์—์„œ transition.abort() ์„ ์ˆ˜ํ–‰ํ•˜๋”๋ผ๋„ ์ง€๊ธˆ๋ณด๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. URL์€ ์ „ํ™˜์ด ์ค‘๋‹จ๋˜์ง€ ์•Š์€ ๊ฒฝ์šฐ ์ด๋™ํ–ˆ์„ ํŽ˜์ด์ง€๋ฅผ ๋ฐ˜์˜ํ•ฉ๋‹ˆ๋‹ค.

: +1 :

@ ef4 ๋‚˜๋Š” ๋‹น์‹ ์ด ์„ฑํ–ฅ์ด ์žˆ๋‹ค๋ฉด ์ด๊ฒƒ์— ์ฐŒ๋ฅด๊ธฐ๋ฅผ ์›ํ•ฉ๋‹ˆ๋‹ค. ๊ท€ํ•˜์˜ ๊ด€์‹ฌ์‚ฌ / ๊ฐ€์šฉ์„ฑ์„ ์•Œ๊ณ  ๊ณ„์‹ญ์‹œ์˜ค.

์ด ์ž‘์—…์€ ํ•  ์ˆ˜ ์žˆ์ง€๋งŒ ๋‹น์žฅ์€ ์•„๋‹ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

: +1 : API ๋ฌธ์„œ์˜ willTransition ์ƒ˜ํ”Œ ์ฝ”๋“œ ๋ฅผ ๋”ฐ๋ฅผ ๋•Œ ์‹คํ–‰๋˜์—ˆ์Šต๋‹ˆ๋‹ค. abort ๊ฐ€ ํ˜ธ์ถœ ๋˜์—ˆ์Œ์—๋„ URL์ด ๋ณ€๊ฒฝ๋ฉ๋‹ˆ๋‹ค.

๋‚˜๋„ ๊ฐ™์€ ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ถ๊ธˆํ•œ ์‚ฌ๋žŒ๋“ค์„ ์œ„ํ•ด jsbin์„ ๋‹ค์‹œ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค. http://emberjs.jsbin.com/tijebi/1

@ ef4๋Š” ์—ฌ์ „ํžˆ ์ด๊ฒƒ์„ ๋ณผ ๊ณ„ํš์ž…๋‹ˆ๊นŒ?

์ฃ„์†กํ•ฉ๋‹ˆ๋‹ค. ๋Šฆ๊ฒŒ ์šฐ์„  ์ˆœ์œ„ ๋ชฉ๋ก์—์„œ ๋‚ฎ์Šต๋‹ˆ๋‹ค.

๊ธฐ๋ก์„ ์œ„ํ•ด ๋ฐฉ๊ธˆ ๊ฐ™์€ ๋ฌธ์ œ๋ฅผ ๊ฒฝํ—˜ํ–ˆ์Šต๋‹ˆ๋‹ค.

์—ด๋ง URL์„ ์ œ๊ฑฐํ•˜๊ณ  # 9919 ์ธ ๊ฒฝ์šฐ ์œ ๋ฆฌํ•ฉ๋‹ˆ๋‹ค.

๋ˆ„๊ตฐ๊ฐ€๊ฐ€ ์—ฌ์ „ํžˆ์ด ๋ฌธ์ œ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๊ณ  _ ์ง€๊ธˆ ๋‹น์žฅ ํ•ด๊ฒฐ์ฑ…์ด ํ•„์š”ํ•œ ๊ฒฝ์šฐ :

// app/routes/your-route.js

export default Ember.Route.extend({
    // ...
    actions: {
        willTransition(transition) {
            var model = this.controller.get('model');
            if (
                model.get('hasDirtyAttributes') && 
                !confirm("You're going to discard all unsaved changes. Are you sure?")
            ) {
                transition.abort();

                // Custom revert of Back button result
                var oldURL = this.router.generate(this.routeName, model);
                var newURL = this.router.location.getURL();
                if (oldURL != newURL) {
                    this.router.location.setURL(oldURL);
                }
            } else {
                return true;
            }
        }
    }
});

this.router.location ๋ฉ”์„œ๋“œ๋ฅผ ์ง์ ‘ ์‚ฌ์šฉํ•˜๊ณ  ์‹ถ์ง€๋Š” ์•Š์ง€๋งŒ ๋ฐ”๋กœ ์ง€๊ธˆ์ด ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ์œ ์ผํ•œ ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค (_ ๋ชจ๋“  ์œ ํ˜•์˜ ์œ„์น˜ _ ์ฒ˜๋ฆฌ).

๋ฐฉ๊ธˆ jsbin์„ ์ž‘๋…„์—์„œ 1.13.4๋กœ ์—…๋ฐ์ดํŠธํ–ˆ๋Š”๋ฐ์ด ๋ฌธ์ œ๊ฐ€ ์—ฌ์ „ํžˆ ์กด์žฌํ•ฉ๋‹ˆ๋‹ค. http://emberjs.jsbin.com/lohekasuhu/edit?html , css, js

1.13.11์—์„œ๋„ ์—ฌ์ „ํžˆ ๋ฌธ์ œ์ž„์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ˜ธ์ถœ abort() ์˜ ์ „ํ™˜์— afterModel URL์— ๊ฒฐ๊ณผ๊ฐ€ ์—…๋ฐ์ดํŠธ๋˜๋Š” ๋ฐ ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์ด ๊นจ์ง„ ์ƒํƒœ๋กœ ์ ์ .

ํ›„์† transitionToRoute ํ˜ธ์ถœ์ด ๊ฒฝ๋กœ๋ฅผ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์—…๋ฐ์ดํŠธํ•˜์ง€ ๋ชปํ–ˆ๊ณ  router.location getURL ๋ฐ setURL ๋ฉ”์„œ๋“œ๊ฐ€ ์—†์œผ๋ฏ€๋กœ ์œ„์˜ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์ด ๋” ์ด์ƒ ์ž‘๋™ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

@bcardarella ์˜ [jsbin์„ 2.5.0์œผ๋กœ] ์—…๋ฐ์ดํŠธ

์ด๊ฒƒ์€ https://github.com/tildeio/router.js/pull/197(2.10.0-beta.3+ ์—์„œ)์— ์˜ํ•ด ์ˆ˜์ •๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

v2.10.0-beta.3์— ๋Œ€ํ•œ ๋ฐ๋ชจ : http://emberjs.jsbin.com/yeqisuh/1

@rwjblue ๋‚˜๋Š” ์ด๊ฒƒ์ด ์ค‘๋‹จ ์‚ฌ๊ฑด์— ๋Œ€ํ•ด ์•„์ง ์ˆ˜์ •๋˜์—ˆ๋Š”์ง€ ํ™•์‹คํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ด ๋ฌธ์ œ๋Š” ember 2.12.0์—์„œ๋ณด๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๋ชจ๋ธ ํ›„ํฌ์—์„œ ์ค‘๋‹จ ๋œ ๊ฒฝ๋กœ๋กœ ์ „ํ™˜ ํ•  ๋•Œ URL์€ ์ „ํ™˜์ด ์ค‘๋‹จ๋˜์ง€ ์•Š์€ ๊ฒƒ์ฒ˜๋Ÿผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์ƒํƒœ๋ฅผ ๋ฐ˜์˜ํ•ฉ๋‹ˆ๋‹ค. ๋‹ค๋ฅธ ์‚ฌ๋žŒ๋“ค์ด ์—ฌ์ „ํžˆ transition#abort ์˜์ด ๋™์ž‘์„ ๊ฒฝํ—˜ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๊นŒ?

@kanderek ์˜ˆ, ๋ฐฉ๊ธˆ์ด ํ–‰๋™์„ ๋ฐœ๊ฒฌํ–ˆ์Šต๋‹ˆ๋‹ค. ๋‚˜๋Š” 2.11.3์— ์žˆ์Šต๋‹ˆ๋‹ค.

์•ˆ๋…•ํ•˜์„ธ์š”,
2.14 ๋…„ 11 ์›”์—๋„ ๋ฌธ์ œ๊ฐ€ ์—ฌ์ „ํžˆ ์กด์žฌํ•˜๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค.

2.11.3์—์„œ์ด ๋ฌธ์ œ ๋ฐœ์ƒ

ํ˜„์žฌ์ด ์ถ”์•…ํ•œ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์„ ์‚ฌ์šฉํ•˜์—ฌ stackoverflow์—์„œ ๋ฐœ๊ฒฌํ–ˆ์Šต๋‹ˆ๋‹ค.

//right after an aborted transition
if (window.history) {
  window.history.forward();
}

์ €๋ฅผ ๋ถ€๋„๋Ÿฝ๊ฒŒํ•˜์ง€ ๋งˆ์„ธ์š” ^

+1

์ด ๋ฌธ์ œ๊ฐ€ ๊ณ„์† ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค! 2.12.2์— ์žˆ์Šต๋‹ˆ๋‹ค.

๋ˆ„๊ตฐ๊ฐ€ ์ด๊ฒƒ์— ๋Œ€ํ•œ ์‹คํŒจํ•œ ์˜ˆ๋ฅผ ์ œ๊ณต ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?

@wagenet ์€ Ember 3.1.1์„ ์‚ฌ์šฉํ•œ ์˜ˆ์ž…๋‹ˆ๋‹ค.
https://github.com/btecu/ember-issues/tree/5210

@SirZach @adamreisnz @bcardarella @bschouwerwou @btecu @cibernox @dkorenblyum @ ef4 @kanderek @kanongil @kottenator @machty @mutewinter @pixelhandler @ rafael-paiva @rwjblue @stefanpenner @wagenet @woprandi ๊ฐ€ ์—ฌ์ „ํžˆ ๋ฌธ์ œ์ž…๋‹ˆ๋‹ค. ๋˜๋Š” ์ด๊ฒƒ์˜ ์ƒˆ๋กœ์šด ๋ณต์ œ๋ฌผ์„ ๋งŒ๋“ค๋ ค๋ฉด ์–ด๋–ป๊ฒŒ ์ƒ๊ฐํ•˜์‹ญ๋‹ˆ๊นŒ?

@btecu ์˜ˆ์ œ๋ฅผ Ember 3.5๋กœ ์—…๋ฐ์ดํŠธ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๊นŒ?

+1 ์ง€๊ธˆ๋„ ์ด๊ฒƒ์— ๋›ฐ์–ด ๋“ค์–ด (๋‚ด ์ƒ๊ฐ ์—”). ์šฐ๋ฆฌ์˜ ๊ฒฝ์šฐ ํŽ˜์ด์ง€๋กœ ์ „ํ™˜ ํ•œ ๋‹ค์Œ window.history.go (-1)์„ ์‚ฌ์šฉํ•˜์—ฌ ๋‹ค์‹œ ๋Œ์•„๊ฐ‘๋‹ˆ๋‹ค. ํ˜„์žฌ ํŽ˜์ด์ง€๋ฅผ ๊ณ„์†๋กœ๋“œํ•˜๋Š” ๊ฒƒ (์ „ํ™˜ ๋“ฑ์„ ์™„๋ฃŒํ•˜๊ณ  ๋‚˜๋จธ์ง€ ๋น„๋™๊ธฐ ์ฝ˜ํ…์ธ ๋ฅผ๋กœ๋“œํ•˜๋Š” ๊ฒƒ)์— ์‹œ๊ฐ„์ด ๊ฑธ๋ฆฝ๋‹ˆ๋‹ค. ๋‹ค์‹œ ์ „ํ™˜ํ•ฉ๋‹ˆ๋‹ค. URL์€ ์ฆ‰์‹œ ์—…๋ฐ์ดํŠธ๋ฉ๋‹ˆ๋‹ค. ํžˆ์Šคํ† ๋ฆฌ API๋ฅผ ์ง์ ‘ ์‚ฌ์šฉํ•˜๊ธฐ ๋•Œ๋ฌธ์ผ๊นŒ์š”?

3.9.1์—์„œ ์ด๊ฒƒ์„ ๊ฒฝํ—˜ํ–ˆ์Šต๋‹ˆ๋‹ค.

์›๋ž˜ ๋ฒ„๊ทธ๊ฐ€ ํ™•์‹คํžˆ ๊ณ ์น  ์•Š์•˜๊ธฐ ๋•Œ๋ฌธ์—์ด ๋ฌธ์ œ๋Š” ๋’ค์ฃฝ๋ฐ•์ฃฝ์ด๋‹ค. ์šฐ๋ฆฌ๋Š” ๋” ์ด์ƒ URL ์—…๋ฐ์ดํŠธ๋ฅผํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์—๋Š” ๋ฌด๊ด€ ํ•œ ์—ญ์‚ฌ๊ฐ€ ๋งŽ๊ธฐ ๋•Œ๋ฌธ์— ๋งˆ๋ฌด๋ฆฌํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค.

@miguelcobain 3.9.1์— ๋Œ€ํ•œ ๋ณต์ œ๋ฌผ์„ ์ƒˆ๋กœ์šด ๋ฌธ์ œ๋กœ ๊ณต์œ ํ•ด ์ฃผ์‹œ๋ฉด ์ ์ ˆํ•œ์ฃผ์˜๋ฅผ๋ฐ›๋Š” ๋ฐ ๋„์›€์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค.

์—ฌ์ „ํžˆ ๋ฌธ์ œ์ธ ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ด๋Š”์ด ๋ฌธ์ œ๋ฅผ ๊ฒ€์ƒ‰ํ–ˆ์„ ๋•Œ ๊ฐ€์žฅ ํฐ ๊ฒฐ๊ณผ ์˜€๊ธฐ ๋•Œ๋ฌธ์—์ด ๋ฌธ์ œ๋ฅผ ๋ฐœ๊ฒฌํ•˜๋Š” ๋ชจ๋“  ์‚ฌ๋žŒ์„์œ„ํ•œ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์ด ํฌํ•จ ๋œ ์—…๋ฐ์ดํŠธ ๋œ ์Šค ๋‹ˆํŽซ์„ ๋ถ™์—ฌ ๋„ฃ์„ ๊ฒƒ์ด๋ผ๊ณ  ์ƒ๊ฐํ–ˆ์Šต๋‹ˆ๋‹ค (์‹ค์ œ ํ•ด๊ฒฐ์ฑ…์ด ์žˆ๋Š”์ง€ ์•Œ๋ ค์ฃผ์„ธ์š”. ๋‚˜๋Š” ๋ชจ๋ฅธ๋‹ค) :

  <strong i="6">@service</strong> router

  <strong i="7">@action</strong> 
  willTransition(transition) {
    if (!transition.to.find(route => route.name === this.routeName) && !confirm('confirm?')) {
      transition.abort()
      let oldURL = this.router.currentURL;
      let newURL = this.router.location.getURL();
      if (oldURL != newURL) {
          this.router.location.setURL(oldURL);
      }
    }
    return true;
  }

์ด๊ฒƒ์€ @kottenator ๊ฐ€ ์œ„์—์„œ ์ œ์‹œ ํ•œ ์ œ์•ˆ์˜ ๋‹จ์ˆœํ™” ๋œ ๋ฒ„์ „์ž…๋‹ˆ๋‹ค (https://github.com/emberjs/ember.js/issues/5210#issuecomment-122033542).

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰