2016-09-02 140 views
2

我有一個使用Angular Material UI框架的AngularJS應用程序。使用角度材質,是否可以關閉特定對話框

該應用程序具有顯示對話框(例如錯誤和加載旋轉器)不同的機制,這將是優選的在某些情況下專門選擇僅靠近之一,例如當一個AJAX請求完成獲取數據時,我希望我的加載微調器關閉,但不會有任何錯誤對話框,這可能是抓取的結果。

我可以在文檔中找到和代碼不同意(儘管代碼應該贏得爭論):

  • Documentation只有最新的說
  • The code說,可以關閉,使用可選的響應最新的,一些最新的或所有打開的,可以關閉,可選原因
  • Example in the documentation說具體的對話可以關閉,用的標記,表示如何或爲何

我已經做了demo of my intent,作爲MCV地 - 這些都是亮點:

var dialog = {}, 
    promise = {}; 

function showDialogs(sourceEvent) { 
    showDialog(sourceEvent, "one"); 
    showDialog(sourceEvent, "two"); 
} 

function showDialog(sourceEvent, id) { 
    dialog[id] = $mdDialog.alert({...}); 

    promise[id] = $mdDialog.show(dialog[id]); 
    promise[id].finally(function() { 
     dialog[id] = undefined; 
    }); 
} 

function closeDialogs() { 
    $mdDialog.hide("Closed all for a reason", {closeAll: true}); 
} 

function closeDialogLatest() { 
    $mdDialog.hide("Closed from the outside"); 
} 

function closeDialogReason() { 
    $mdDialog.hide("Closed with a reason"); 
} 

function closeDialogSpecific(id) { 
    $mdDialog.hide(dialog[id], "finished"); 
} 

編輯:
我知道代碼總是贏會發生什麼的說法,但我不能完全肯定這是我正在看的正確的代碼。
我已經更新了示例以更好地測試和說明我的觀點和問題。這顯示了代碼所說的工作。

我真正追求的是它是否可能仍然是可能實現我在我沒想到的一些其它方式的目標。

+1

可能文檔是錯的或太舊。文檔可以說任何作者想要的。如果守則說這是不可能的,那麼它實際上是不可能的。對不起。 – RicoBrassers

+0

我知道代碼是重要的,但我並不完全確定這是我正在查看的正確代碼。也就是說,我所做的例子表明事情要按照代碼說的去工作,但仍然有可能以其他方式實現我的目標,但我還沒有想到。 – Flygenring

回答

3

使用$mdPanel代替$mdDialog我能達到預期的效果;我分叉我的demo以反映這些變化 - 這些是亮點:

var dialog = {}; 

function showDialogs() { 
    showDialog("one"); 
    showDialog("two"); 
} 

function showDialog(id) { 
    var config = {...}; 

    $mdPanel.open(config) 
     .then(function(panelRef) { 
      dialog[id] = panelRef; 
     }); 
} 

function closeDialogs() { 
    var id; 

    for(id in dialog) { 
     closeDialogSpecific(id, "Closed all for a reason"); 
    } 
} 

function closeDialogSpecific(id, reason) { 
    var message = reason || "finished: " + id; 

    if(!dialog.hasOwnProperty(id) || !angular.isObject(dialog[id])) { 
     return; 
    } 

    if(dialog[id] && dialog[id].close) { 
     dialog[id].close() 
      .then(function() { 
       vm.feedback = message; 
      }); 
     dialog[id] = undefined; 
    } 
} 
2

我建議有兩個或兩個以上的對話了,同時不理想,可能不推薦使用由谷歌設計的材料。

要從docs

使用對話框謹慎報價,因爲他們是中斷的。

你說:

當AJAX請求完成讀取數據,我想我的 正在加載的旋轉關閉,但沒有任何錯誤對話框,可以抓取的 結果。

我在這裏的解決方案將有一個對話框,最初顯示微調。請求完成後,用任何消息替換微調器。

+0

我同意不應該有太多的對話框,並且它們被構建爲在框架中堆疊,所以在一定程度上可以。我這樣做的原因是告知用戶錯誤會中斷他們的工作,並且(如特別要求的)在加載數據時阻止所有交互(即保存長表單),以便用戶知道事情正在發生但在此期間不能混亂。 – Flygenring

+0

@Flygenring你確定你不能用一個對話完成所有的事情嗎? :-) –

+0

雖然我可能能夠做到,但是需要對整個系統進行重構,因爲錯誤處理(包括對話框)是通過掛鉤到內置的異常處理來集中處理的,並且直接對特定操作應用加載。但建議非常感謝! :-) – Flygenring

相關問題